diff options
| -rw-r--r-- | packages/browser/README.md | 60 | ||||
| -rw-r--r-- | packages/browser/package.json | 5 | ||||
| -rw-r--r-- | packages/browser/rollup.config.js | 26 | ||||
| -rw-r--r-- | packages/browser/tsconfig.es5.json | 2 |
4 files changed, 44 insertions, 49 deletions
diff --git a/packages/browser/README.md b/packages/browser/README.md index 563dd2d..e521305 100644 --- a/packages/browser/README.md +++ b/packages/browser/README.md @@ -9,12 +9,12 @@ - [@simplewebauthn/browser](#simplewebauthnbrowser) - [Installation](#installation) - [UMD](#umd) - - [ES2018](#es2018) - [ES5](#es5) + - [ES2018](#es2018) - [Usage](#usage) - [Building for Production](#building-for-production) - - [ES2018](#es2018-1) - [ES5](#es5-1) + - [ES2018](#es2018-1) - [Webpack support](#webpack-support) - [Rollup support](#rollup-support) @@ -32,22 +32,22 @@ This package can also be installed via **unpkg** by including the following scri > NOTE: The only difference between the two packages below is that the ES5 bundle includes TypeScript's `tslib` runtime code. This adds some bundle size overhead, but _does_ enable use of `supportsWebAuthn()` in older browsers to show appropriate UI when WebAuthn is unavailable. -#### ES2018 +#### ES5 -If you only need to support modern browsers, include the `ES2018` version: +If you need to support WebAuthn feature detection in deprecated browsers like IE11 and Edge Legacy, include the `ES5` version: ```html -<script src="https://unpkg.com/@simplewebauthn/browser/dist/es2018/index.umd.min.js"></script> +<script src="https://unpkg.com/@simplewebauthn/browser/dist/es5/index.umd.min.js"></script> ``` -#### ES5 +#### ES2018 -If you need to support WebAuthn feature detection in deprecated browsers like IE11 and Edge Legacy, include the `ES5` version: +If you only need to support modern browsers, include the `ES2018` version: ```html -<script src="https://unpkg.com/@simplewebauthn/browser/dist/es5/index.umd.min.js"></script> +<script src="https://unpkg.com/@simplewebauthn/browser/dist/es2018/index.umd.min.js"></script> ``` ## Usage @@ -58,15 +58,13 @@ You can find in-depth documentation on this package here: https://simplewebauthn Two unbundled versions of this library are offered for your convenience, one targeting `ES2018` and a second targeting `ES5`. -### ES2018 - -The `ES2018` version is suitable for use when only **modern browsers** need to be supported. TypeScript and JavaScript codebases alike can import and use this library without any special build configuration considerations. - ### ES5 -The `ES5` version can also be used in both TypeScript and JavaScript codebases. However, you will need to ensure that your bundler pulls in the ES5 version of the library when building your application! +The `ES5` version is suitable for use when **old browsers** need to be supported and it's **default** version of this library which is read in the `main` entry from @simplewebauthn/browser's **package.json**. + +TypeScript and JavaScript codebases alike can import and use this library without any special build configuration considerations. -You will also need to ensure that the `tslib` dependency gets pulled into your build artifact: +However, you will need to ensure that the `tslib` dependency gets pulled into your build artifact: - If you are authoring your application in TypeScript then this package will be **automatically** included so long as your **tsconfig.json** sets `"target": "ES5"`. - If your application is written in Javascript then you will need to install this package **manually** by adding it to `dependencies` in your project's **package. json**: @@ -75,39 +73,41 @@ You will also need to ensure that the `tslib` dependency gets pulled into your b $> npm install tslib ``` -#### Webpack support +### ES2018 + +The `ES2018` version is suitable for use when only **modern browsers** need to be supported. TypeScript and JavaScript codebases alike can import and use this library. However, you will need to ensure that your bundler pulls in the ES2018 version of the library when building your application! -If your Webpack config's `"target"` is set to `"web"` ([the default value](https://webpack.js.org/configuration/target/)) then you're done - Webpack will pull in the ES5 build from the `"browser"` property in @simplewebauthn/browser's **package.json**. +#### Webpack support -If you've set a different value for `"target"`, though, then you'll need to indicate additional files for WebPack to resolve via the [`"resolve.mainFields"`](https://webpack.js.org/configuration/resolve/#resolvemainfields) property in your Webpack config: +No matter the `"target"` of your build, though, then you'll need to indicate additional files for WebPack to resolve via the [`"resolve.mainFields"`](https://webpack.js.org/configuration/resolve/#resolvemainfields) property in your Webpack config to read in the `main:es2018` entry from @simplewebauthn/browser's **package.json**: ```js module.exports = { - //... - resolve: { - mainFields: [ 'browser', 'module', 'main' ], - }, + //... + resolve: { + mainFields: [ 'main:es2018', 'module', 'main' ], + }, }; ``` -`'browser'` must come first in the list to ensure that the `ES5` version of this library is bundled. Additional values can be added afterwards as needed. +`'main:es2018'` must come first in the list to ensure that the `ES2018` version of this library is bundled. Additional values can be added afterwards as needed. #### Rollup support -The [`@rollup/plugin-node-resolve`](https://github.com/rollup/rollup-plugin-node-resolve#usage) plugin can be added to your Rollup config to read in the `browser` entry from @simplewebauthn/browser's **package.json**: +The [`@rollup/plugin-node-resolve`](https://github.com/rollup/rollup-plugin-node-resolve#usage) plugin has to be added to your Rollup config to read in the `main:es2018` entry from @simplewebauthn/browser's **package.json**: ```js // rollup.config.js import resolve from 'rollup-plugin-node-resolve'; export default { - // input: ... - // output: ... - plugins: [ - //... - resolve({ mainFields: [ 'browser', 'module', 'main' ] }), - ] + // input: ... + // output: ... + plugins: [ + //... + resolve({ mainFields: [ 'main:es2018', 'module', 'main' ] }), + ] } ``` -`'browser'` must come first in the list to ensure that the `ES5` version of this library is bundled. Additional values can be added afterwards as needed. +`'main:es2018'` must come first in the list to ensure that the `ES2018` version of this library is bundled. Additional values can be added afterwards as needed. diff --git a/packages/browser/package.json b/packages/browser/package.json index 3524ce6..1142244 100644 --- a/packages/browser/package.json +++ b/packages/browser/package.json @@ -2,8 +2,8 @@ "name": "@simplewebauthn/browser", "version": "2.2.1", "description": "SimpleWebAuthn for Browsers", - "main": "dist/es2018/index.js", - "browser": "dist/es5/index.js", + "main": "dist/es5/index.js", + "main:es2018": "dist/es2018/index.js", "types": "dist/types/index.d.ts", "author": "Matthew Miller <matthew@millerti.me>", "license": "MIT", @@ -33,7 +33,6 @@ "tslib": "^2.2.0" }, "devDependencies": { - "@rollup/plugin-commonjs": "^18.0.0", "@rollup/plugin-node-resolve": "^11.2.1", "@rollup/plugin-typescript": "^8.2.1", "@simplewebauthn/typescript-types": "file:../typescript-types", diff --git a/packages/browser/rollup.config.js b/packages/browser/rollup.config.js index 3428748..e504244 100644 --- a/packages/browser/rollup.config.js +++ b/packages/browser/rollup.config.js @@ -1,5 +1,4 @@ import typescript from '@rollup/plugin-typescript'; -import commonjs from '@rollup/plugin-commonjs'; import nodeResolve from '@rollup/plugin-node-resolve'; import { terser } from 'rollup-plugin-terser'; // import versionInjector from 'rollup-plugin-version-injector'; @@ -13,20 +12,19 @@ const cleanTslibCommentInUMDBundleTargetingES5 = () => { renderChunk: async code => { const comment = ` /*! ***************************************************************************** -\tCopyright (c) Microsoft Corporation. + Copyright (c) Microsoft Corporation. -\tPermission to use, copy, modify, and/or distribute this software for any -\tpurpose with or without fee is hereby granted. + Permission to use, copy, modify, and/or distribute this software for any + purpose with or without fee is hereby granted. -\tTHE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH -\tREGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY -\tAND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, -\tINDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM -\tLOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR -\tOTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR -\tPERFORMANCE OF THIS SOFTWARE. -\t***************************************************************************** */ -`; + THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH + REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY + AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, + INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM + LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR + OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR + PERFORMANCE OF THIS SOFTWARE. + ***************************************************************************** */`; return code.indexOf(comment) > -1 ? code.replace(comment, '') : null; }, }; @@ -90,7 +88,6 @@ export default [ }, plugins: [ typescript({ tsconfig: './tsconfig.es5.json' }), - commonjs({ extensions: ['.ts'] }), nodeResolve(), // swanVersionInjector, ], @@ -107,7 +104,6 @@ export default [ }, plugins: [ typescript({ tsconfig: './tsconfig.es5.json' }), - commonjs({ extensions: ['.ts'] }), nodeResolve(), // swanVersionInjector, ], diff --git a/packages/browser/tsconfig.es5.json b/packages/browser/tsconfig.es5.json index 3d1a328..b652f4b 100644 --- a/packages/browser/tsconfig.es5.json +++ b/packages/browser/tsconfig.es5.json @@ -2,7 +2,7 @@ "extends": "./tsconfig.json", "compilerOptions": { "target": "ES5", - "module": "COMMONJS", + "module": "ES2020", "moduleResolution": "node", "lib": [ "ES5", |