From 49b7d498d1b6386bd051b5c940a7eb619033fb5b Mon Sep 17 00:00:00 2001 From: Kiko Beats Date: Fri, 18 Nov 2022 16:58:43 +0100 Subject: [PATCH] test: ensure bundle is working (#293) * test: ensure bundle is working * refactor: rename module into mjs * fix: styled as esm module * fix: use webpack5 with storybook --- packages/hover-react/.storybook/main.js | 5 +- packages/hover-react/package.json | 12 ++--- packages/hover-react/rollup.config.js | 23 +++------ packages/hover-vanilla/package.json | 10 ++-- packages/hover-vanilla/rollup.config.js | 65 +++++++++++-------------- packages/react/package.json | 13 +++-- packages/react/rollup.config.js | 24 ++++----- packages/vanilla/package.json | 6 +-- packages/vanilla/rollup.config.js | 17 ++++--- 9 files changed, 81 insertions(+), 94 deletions(-) diff --git a/packages/hover-react/.storybook/main.js b/packages/hover-react/.storybook/main.js index bcee8a28e..11ced5e29 100644 --- a/packages/hover-react/.storybook/main.js +++ b/packages/hover-react/.storybook/main.js @@ -1 +1,4 @@ -module.exports = { stories: ['../stories/index.js'] } +module.exports = { + stories: ['../stories/index.js'], + core: { builder: 'webpack5' } +} diff --git a/packages/hover-react/package.json b/packages/hover-react/package.json index d4094e496..fb36f5076 100644 --- a/packages/hover-react/package.json +++ b/packages/hover-react/package.json @@ -3,9 +3,9 @@ "description": "Turn links into beautiful previews.", "homepage": "https://microlink.io/sdk", "version": "5.5.10", - "main": "dist/microlink.js", - "module": "dist/microlink.module.js", - "jsnext:main": "dist/microlink.module.js", + "main": "dist/microlink.cjs", + "module": "dist/microlink.mjs", + "jsnext:main": "dist/microlink.mjs", "repository": { "directory": "packages/hover-react", "type": "git", @@ -29,6 +29,8 @@ }, "devDependencies": { "@babel/core": "latest", + "@storybook/builder-webpack5": "latest", + "@storybook/manager-webpack5": "latest", "@babel/plugin-proposal-class-properties": "latest", "@babel/plugin-proposal-object-rest-spread": "latest", "@babel/plugin-transform-react-constant-elements": "latest", @@ -95,7 +97,5 @@ }, "publishConfig": { "access": "public" - }, - "umd:main": "dist/microlink.umd.js", - "unpkg": "dist/microlink.umd.js" + } } diff --git a/packages/hover-react/rollup.config.js b/packages/hover-react/rollup.config.js index 60eb8f74a..a7b718764 100644 --- a/packages/hover-react/rollup.config.js +++ b/packages/hover-react/rollup.config.js @@ -28,7 +28,10 @@ const plugins = ({ compress }) => [ filesize(), visualizer({ template: 'treemap' }), replace({ - 'process.env.NODE_ENV': JSON.stringify('production') + preventAssignment: true, + values: { + 'process.env.NODE_ENV': JSON.stringify('production') + } }) ] @@ -50,34 +53,24 @@ const build = ({ file, format, name, exports }) => { } const builds = [ - build({ - format: 'umd', - file: 'dist/microlink.umd.js', - name: 'microlink' - }), - build({ - format: 'umd', - file: 'dist/microlink.umd.min.js', - name: 'microlink' - }), build({ format: 'esm', - file: 'dist/microlink.module.js', + file: 'dist/microlink.mjs', exports: 'named' }), build({ format: 'esm', - file: 'dist/microlink.module.min.js', + file: 'dist/microlink.min.mjs', exports: 'named' }), build({ format: 'cjs', - file: 'dist/microlink.js', + file: 'dist/microlink.cjs', exports: 'named' }), build({ format: 'cjs', - file: 'dist/microlink.min.js', + file: 'dist/microlink.min.cjs', exports: 'named' }) ] diff --git a/packages/hover-vanilla/package.json b/packages/hover-vanilla/package.json index da63e23c7..50ff6050e 100644 --- a/packages/hover-vanilla/package.json +++ b/packages/hover-vanilla/package.json @@ -3,9 +3,9 @@ "description": "Turn links into beautiful previews.", "homepage": "https://microlink.io/sdk", "version": "5.5.10", - "main": "dist/microlink.js", - "module": "dist/microlink.module.js", - "jsnext:main": "dist/microlink.module.js", + "main": "dist/microlink.cjs", + "module": "dist/microlink.mjs", + "jsnext:main": "dist/microlink.mjs", "repository": { "directory": "packages/hover-vanilla", "type": "git", @@ -54,6 +54,6 @@ "publishConfig": { "access": "public" }, - "umd:main": "dist/microlink.umd.js", - "unpkg": "dist/microlink.umd.js" + "umd:main": "dist/microlink.js", + "unpkg": "dist/microlink.js" } diff --git a/packages/hover-vanilla/rollup.config.js b/packages/hover-vanilla/rollup.config.js index c00197ace..33e788442 100644 --- a/packages/hover-vanilla/rollup.config.js +++ b/packages/hover-vanilla/rollup.config.js @@ -16,7 +16,10 @@ const plugins = ({ compress }) => filesize(), visualizer({ template: 'treemap' }), replace({ - 'process.env.NODE_ENV': JSON.stringify('production') + preventAssignment: true, + values: { + 'process.env.NODE_ENV': JSON.stringify('production') + } }), !isProduction && copy({ @@ -53,42 +56,32 @@ const builds = [ format: 'umd', file: 'dist/microlink.js', name: 'microlinkHover' + }), + build({ + format: 'umd', + file: 'dist/microlink.min.js', + name: 'microlinkHover' + }), + build({ + format: 'esm', + file: 'dist/microlink.mjs', + exports: 'named' + }), + build({ + format: 'esm', + file: 'dist/microlink.min.mjs', + exports: 'named' + }), + build({ + format: 'cjs', + file: 'dist/microlink.cjs', + exports: 'named' + }), + build({ + format: 'cjs', + file: 'dist/microlink.min.cjs', + exports: 'named' }) ] -if (isProduction) { - builds.concat([ - build({ - format: 'umd', - file: 'dist/microlink.js', - name: 'microlinkHover' - }), - build({ - format: 'umd', - file: 'dist/microlink.min.js', - name: 'microlinkHover' - }), - build({ - format: 'esm', - file: 'dist/microlink.module.js', - exports: 'named' - }), - build({ - format: 'esm', - file: 'dist/microlink.min.module.js', - exports: 'named' - }), - build({ - format: 'cjs', - file: 'dist/microlink.cjs.js', - exports: 'named' - }), - build({ - format: 'cjs', - file: 'dist/microlink.cjs.min.js', - exports: 'named' - }) - ]) -} - export default builds diff --git a/packages/react/package.json b/packages/react/package.json index 8c7522a3b..a2bed4448 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -3,9 +3,9 @@ "description": "Turn links into beautiful previews.", "homepage": "https://microlink.io/sdk", "version": "5.5.10", - "main": "dist/microlink.js", - "module": "dist/microlink.module.js", - "jsnext:main": "dist/microlink.module.js", + "main": "dist/microlink.cjs", + "module": "dist/microlink.mjs", + "jsnext:main": "dist/microlink.mjs", "repository": { "directory": "packages/react", "type": "git", @@ -78,7 +78,8 @@ "build-storybook": "NODE_ENV=production build-storybook --quiet", "dev": "start-storybook -p 6006", "start": "node scripts/start.js", - "test": "NODE_ENV=test jest --detectOpenHandles" + "pretest": "npm run build", + "test": "node -e \"require('./')\" && NODE_ENV=test jest --detectOpenHandles" }, "license": "MIT", "jest": { @@ -96,7 +97,5 @@ }, "publishConfig": { "access": "public" - }, - "umd:main": "dist/microlink.umd.js", - "unpkg": "dist/microlink.umd.js" + } } diff --git a/packages/react/rollup.config.js b/packages/react/rollup.config.js index d47207075..61f2f424a 100644 --- a/packages/react/rollup.config.js +++ b/packages/react/rollup.config.js @@ -28,7 +28,10 @@ const plugins = ({ compress }) => [ filesize(), visualizer({ template: 'treemap' }), replace({ - 'process.env.NODE_ENV': JSON.stringify('production') + preventAssignment: true, + values: { + 'process.env.NODE_ENV': JSON.stringify('production') + } }) ] @@ -37,6 +40,7 @@ const build = ({ file, format, name, exports }) => { return { input: './src/index.js', output: { + interop: id => (id === 'styled-components' ? 'esModule' : 'default'), sourcemap: compress, file, format, @@ -50,34 +54,24 @@ const build = ({ file, format, name, exports }) => { } const builds = [ - build({ - format: 'umd', - file: 'dist/microlink.umd.js', - name: 'microlink' - }), - build({ - format: 'umd', - file: 'dist/microlink.umd.min.js', - name: 'microlink' - }), build({ format: 'esm', - file: 'dist/microlink.module.js', + file: 'dist/microlink.mjs', exports: 'named' }), build({ format: 'esm', - file: 'dist/microlink.min.module.js', + file: 'dist/microlink.min.mjs', exports: 'named' }), build({ format: 'cjs', - file: 'dist/microlink.js', + file: 'dist/microlink.cjs', exports: 'named' }), build({ format: 'cjs', - file: 'dist/microlink.min.js', + file: 'dist/microlink.min.cjs', exports: 'named' }) ] diff --git a/packages/vanilla/package.json b/packages/vanilla/package.json index 268cf9de2..07233bef6 100644 --- a/packages/vanilla/package.json +++ b/packages/vanilla/package.json @@ -3,9 +3,9 @@ "description": "Turn links into beautiful previews.", "homepage": "https://microlink.io/sdk", "version": "5.5.10", - "main": "dist/microlink.js", - "module": "dist/microlink.module.js", - "jsnext:main": "dist/microlink.module.js", + "main": "dist/microlink.cjs", + "module": "dist/microlink.mjs", + "jsnext:main": "dist/microlink.mjs", "repository": { "directory": "packages/vanilla", "type": "git", diff --git a/packages/vanilla/rollup.config.js b/packages/vanilla/rollup.config.js index 45095d64a..6ba86e7c6 100644 --- a/packages/vanilla/rollup.config.js +++ b/packages/vanilla/rollup.config.js @@ -12,7 +12,10 @@ const plugins = ({ compress }) => [ filesize(), visualizer({ template: 'treemap' }), replace({ - 'process.env.NODE_ENV': JSON.stringify('production') + preventAssignment: true, + values: { + 'process.env.NODE_ENV': JSON.stringify('production') + } }) ] @@ -40,7 +43,7 @@ const build = ({ file, format, name, exports }) => { } } -export default [ +const builds = [ build({ format: 'umd', file: 'dist/microlink.js', @@ -53,22 +56,24 @@ export default [ }), build({ format: 'esm', - file: 'dist/microlink.module.js', + file: 'dist/microlink.mjs', exports: 'named' }), build({ format: 'esm', - file: 'dist/microlink.min.module.js', + file: 'dist/microlink.min.mjs', exports: 'named' }), build({ format: 'cjs', - file: 'dist/microlink.cjs.js', + file: 'dist/microlink.cjs', exports: 'named' }), build({ format: 'cjs', - file: 'dist/microlink.cjs.min.js', + file: 'dist/microlink.min.cjs', exports: 'named' }) ] + +export default builds