chore: support esm in browser

Author: BuptStEve

README-zh_CN.md

@@ -34,8 +34,11 @@ $ yarn add tua-body-scroll-lock
 
 ### CDN
 * UMD(`tua-bsl.umd.js`)
-  * [unpkg](https://unpkg.com/tua-body-scroll-lock)
-  * [jsdelivr](https://cdn.jsdelivr.net/npm/tua-body-scroll-lock)
+  * unpkg: https://unpkg.com/tua-body-scroll-lock
+  * jsdelivr: https://cdn.jsdelivr.net/npm/tua-body-scroll-lock
+
+<details>
+<summary>example code</summary>
 
 ```html
 <!-- unpkg -->
@@ -45,9 +48,14 @@ $ yarn add tua-body-scroll-lock
 <script src="https://cdn.jsdelivr.net/npm/tua-body-scroll-lock"></script>
 ```
 
+</details>
+
 * Minified UMD(`tua-bsl.umd.min.js`)
-  * [unpkg](https://unpkg.com/tua-body-scroll-lock/dist/tua-bsl.umd.min.js)
-  * [jsdelivr](https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.umd.min.js)
+  * unpkg: https://unpkg.com/tua-body-scroll-lock/dist/tua-bsl.umd.min.js
+  * jsdelivr: https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.umd.min.js
+
+<details>
+<summary>example code</summary>
 
 ```html
 <!-- unpkg -->
@@ -57,6 +65,62 @@ $ yarn add tua-body-scroll-lock
 <script src="https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.umd.min.js"></script>
 ```
 
+</details>
+
+* ESM in browser(`tua-bsl.esm.browser.js`)
+  * unpkg: https://unpkg.com/tua-body-scroll-lock/dist/tua-bsl.esm.browser.js
+  * jsdelivr: https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.esm.browser.js
+
+<details>
+<summary>example code</summary>
+
+```html
+<!-- unpkg -->
+<script type="module">
+    import { lock, unlock } from 'https://unpkg.com/tua-body-scroll-lock/dist/tua-bsl.esm.browser.js'
+
+    lock()
+    unlock()
+</script>
+
+<!-- jsdelivr -->
+<script type="module">
+    import { lock, unlock } from 'https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.esm.browser.js'
+
+    lock()
+    unlock()
+</script>
+```
+
+</details>
+
+* Minified ESM in browser(`tua-bsl.esm.browser.min.js`)
+  * unpkg: https://unpkg.com/tua-body-scroll-lock/dist/tua-bsl.esm.browser.min.js
+  * jsdelivr: https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.esm.browser.min.js
+
+<details>
+<summary>example code</summary>
+
+```html
+<!-- unpkg -->
+<script type="module">
+    import { lock, unlock } from 'https://unpkg.com/tua-body-scroll-lock/dist/tua-bsl.esm.browser.min.js'
+
+    lock()
+    unlock()
+</script>
+
+<!-- jsdelivr -->
+<script type="module">
+    import { lock, unlock } from 'https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.esm.browser.min.js'
+
+    lock()
+    unlock()
+</script>
+```
+
+</details>
+
 ## 使用
 ### 常规操作
 

README.md

@@ -34,8 +34,11 @@ $ yarn add tua-body-scroll-lock
 
 ### CDN
 * UMD(`tua-bsl.umd.js`)
-  * [unpkg](https://unpkg.com/tua-body-scroll-lock)
-  * [jsdelivr](https://cdn.jsdelivr.net/npm/tua-body-scroll-lock)
+  * unpkg: https://unpkg.com/tua-body-scroll-lock
+  * jsdelivr: https://cdn.jsdelivr.net/npm/tua-body-scroll-lock
+
+<details>
+<summary>example code</summary>
 
 ```html
 <!-- unpkg -->
@@ -45,9 +48,14 @@ $ yarn add tua-body-scroll-lock
 <script src="https://cdn.jsdelivr.net/npm/tua-body-scroll-lock"></script>
 ```
 
+</details>
+
 * Minified UMD(`tua-bsl.umd.min.js`)
-  * [unpkg](https://unpkg.com/tua-body-scroll-lock/dist/tua-bsl.umd.min.js)
-  * [jsdelivr](https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.umd.min.js)
+  * unpkg: https://unpkg.com/tua-body-scroll-lock/dist/tua-bsl.umd.min.js
+  * jsdelivr: https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.umd.min.js
+
+<details>
+<summary>example code</summary>
 
 ```html
 <!-- unpkg -->
@@ -57,6 +65,62 @@ $ yarn add tua-body-scroll-lock
 <script src="https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.umd.min.js"></script>
 ```
 
+</details>
+
+* ESM in browser(`tua-bsl.esm.browser.js`)
+  * unpkg: https://unpkg.com/tua-body-scroll-lock/dist/tua-bsl.esm.browser.js
+  * jsdelivr: https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.esm.browser.js
+
+<details>
+<summary>example code</summary>
+
+```html
+<!-- unpkg -->
+<script type="module">
+    import { lock, unlock } from 'https://unpkg.com/tua-body-scroll-lock/dist/tua-bsl.esm.browser.js'
+
+    lock()
+    unlock()
+</script>
+
+<!-- jsdelivr -->
+<script type="module">
+    import { lock, unlock } from 'https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.esm.browser.js'
+
+    lock()
+    unlock()
+</script>
+```
+
+</details>
+
+* Minified ESM in browser(`tua-bsl.esm.browser.min.js`)
+  * unpkg: https://unpkg.com/tua-body-scroll-lock/dist/tua-bsl.esm.browser.min.js
+  * jsdelivr: https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.esm.browser.min.js
+
+<details>
+<summary>example code</summary>
+
+```html
+<!-- unpkg -->
+<script type="module">
+    import { lock, unlock } from 'https://unpkg.com/tua-body-scroll-lock/dist/tua-bsl.esm.browser.min.js'
+
+    lock()
+    unlock()
+</script>
+
+<!-- jsdelivr -->
+<script type="module">
+    import { lock, unlock } from 'https://cdn.jsdelivr.net/npm/tua-body-scroll-lock/dist/tua-bsl.esm.browser.min.js'
+
+    lock()
+    unlock()
+</script>
+```
+
+</details>
+
 ## Usage
 ### Normal
 

package.json

@@ -57,7 +57,7 @@
         "rollup-plugin-eslint": "^5.0.0",
         "rollup-plugin-json": "^3.1.0",
         "rollup-plugin-replace": "^2.1.0",
-        "rollup-plugin-uglify": "^6.0.2"
+        "rollup-plugin-terser": "^5.0.0"
     },
     "repository": {
         "type": "git",

rollup.config.js

@@ -1,7 +1,8 @@
 import babel from 'rollup-plugin-babel'
 import replace from 'rollup-plugin-replace'
 import { eslint } from 'rollup-plugin-eslint'
-import { uglify } from 'rollup-plugin-uglify'
+import { terser } from 'rollup-plugin-terser'
+import { DEFAULT_EXTENSIONS } from '@babel/core'
 
 const pkg = require('./package.json')
 
@@ -12,8 +13,8 @@ const banner =
  * @license ${pkg.license}
  */
 `
-const plugins = [ eslint(), babel() ]
 
+const extensions = [...DEFAULT_EXTENSIONS, 'ts', 'tsx']
 const configMap = {
     esm: {
         file: pkg.module,
@@ -29,19 +30,31 @@ const configMap = {
         format: 'umd',
         env: 'production',
     },
+    esmBrowserDev: {
+        env: 'development',
+        file: 'dist/tua-bsl.esm.browser.js',
+        format: 'esm',
+        transpile: false,
+    },
+    esmBrowserProd: {
+        env: 'production',
+        file: 'dist/tua-bsl.esm.browser.min.js',
+        format: 'esm',
+        transpile: false,
+    },
 }
 
 const genConfig = (opts) => {
     const isProd = /min\.js$/.test(opts.file)
 
     const config = {
         input: 'src/index.js',
-        plugins: plugins.slice(),
+        plugins: [eslint({ include: '**/*.js' })],
         output: {
             file: opts.file,
-            format: opts.format,
-            banner,
             name: 'bodyScrollLock',
+            banner,
+            format: opts.format,
         },
     }
 
@@ -50,9 +63,17 @@ const genConfig = (opts) => {
             'process.env.NODE_ENV': JSON.stringify(opts.env),
         }))
     }
+    if (opts.transpile !== false) {
+        config.plugins.push(babel({ extensions }))
+    }
 
     if (isProd) {
-        config.plugins.push(uglify())
+        config.plugins.push(terser({
+            output: {
+                /* eslint-disable */
+                ascii_only: true,
+            },
+        }))
     }
 
     return config