dnrops
/
bytemd
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

docs: legacy browsers usage

This commit is contained in:
Rongjian Zhang 2022-03-12 15:53:53 +08:00
parent 97cc1d7e46
commit cb1e49dd27
6 changed files with 10 additions and 1058 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
babel.config.js
View File

@ -1,12 +0,0 @@
module.exports = {
presets: [
[
'@babel/preset-env',
{
modules: false,
targets: { ie: 9 },
},
],
],
plugins: ['@babel/plugin-transform-runtime'],
}

9
examples/legacy-browser/index.html
View File

@ -4,12 +4,15 @@
<meta name="viewport" content="width=device-width" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>IE9 Example</title>
<link rel="stylesheet" href="https://unpkg.com/bytemd/dist/index.min.css" />
<link
rel="stylesheet"
href="https://unpkg.com/bytemd@1.11.0/dist/index.min.css"
/>
<link rel="stylesheet" href="https://unpkg.com/github-markdown-css" />
<script src="https://polyfill.io/v3/polyfill.min.js"></script>
<script src="https://polyfill.io/v3/polyfill.min.js?features=Uint16Array,Array.prototype.find,smoothscroll"></script>
<script src="https://unpkg.com/bytemd/dist/index.es5.min.js"></script>
<script src="https://unpkg.com/@bytemd/plugin-gfm/dist/index.es5.min.js"></script>
<script src="https://unpkg.com/bytemd@1.11.0/dist/index.es5.min.js"></script>
<script src="https://unpkg.com/@bytemd/plugin-gfm@1.11.0/dist/index.es5.min.js"></script>
</head>
<body>
<body>

32
examples/legacy-browser/local.html
View File

@ -1,32 +0,0 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>IE9 Example</title>
<link rel="stylesheet" href="../../packages/bytemd/dist/index.min.css" />
<link rel="stylesheet" href="https://unpkg.com/github-markdown-css" />
<script src="https://polyfill.io/v3/polyfill.min.js"></script>
<script src="https://polyfill.io/v3/polyfill.min.js?features=Uint16Array,Array.prototype.find,smoothscroll"></script>
<script src="../../packages/bytemd/dist/index.es5.min.js"></script>
<script src="../../packages/plugin-gfm/dist/index.es5.min.js"></script>
</head>
<body>
<body>
<!-- prettier-ignore -->
<script>
var plugins = [bytemdPluginGfm()];
var editor = new bytemd.Editor({
target: document.body,
props: {
value: '# heading\n\nparagraph\n\n> blockquote',
plugins: plugins
}
});
editor.$on('change', function (e) {
editor.$set({ value: e.detail.value });
});
</script>
</body>
</body>
</html>

3
package.json
View File

@ -15,9 +15,6 @@
"docs:serve": "vitepress serve docs"
},
"devDependencies": {
"@babel/core": "^7.17.0",
"@babel/plugin-transform-runtime": "^7.16.10",
"@babel/preset-env": "^7.16.11",
"@icon-park/svg": "^1.3.5",
"@microsoft/api-extractor": "^7.19.4",
"@sveltejs/vite-plugin-svelte": "^1.0.0-next.35",

5
packages/bytemd/README.md
View File

@ -21,10 +21,9 @@ ByteMD is a Markdown editor component built with Svelte. It could also be used i
### Legacy browsers support
The default entry of NPM package only supports modern browsers. There are two ways to make legacy browsers (**IE9+**) work:
The default entry of NPM package only supports modern browsers. To make legacy browsers (**IE9+**) work, You can compile it with ESNext -> ES5 transpilers, such as [Babel](https://babeljs.io/) or [SWC](https://swc.rs/).
1. Compile it with ESNext -> ES5 transpilers, such as [Babel](./babel.config.js)
2. Use the ES5 bundle(`dist/index.es5.js`)
> The ES5 bundle will no longer be available after version 1.11.0. If you need it, you can use [version 1.11.0](https://unpkg.com/bytemd@1.11.0/dist/index.es5.min.js) or earlier versions
Notice that polyfills are not included, and should be imported manually, see the [legacy browser example](https://github.com/bytedance/bytemd/blob/main/examples/legacy-browser/index.html).

1007
pnpm-lock.yaml
View File

File diff suppressed because it is too large Load Diff