diff --git a/addons/actions/src/manager.tsx b/addons/actions/src/manager.tsx index a7bfd9dbf596..d77272be077b 100644 --- a/addons/actions/src/manager.tsx +++ b/addons/actions/src/manager.tsx @@ -1,4 +1,4 @@ -import * as React from 'react'; +import React from 'react'; import addons from '@storybook/addons'; import ActionLogger from './containers/ActionLogger'; import { ADDON_ID, PANEL_ID, PARAM_KEY } from './constants'; diff --git a/examples/marko-cli/src/stories/hello.stories.js b/examples/marko-cli/src/stories/hello.stories.js index a6a717560ad8..1a4ec71f5749 100644 --- a/examples/marko-cli/src/stories/hello.stories.js +++ b/examples/marko-cli/src/stories/hello.stories.js @@ -8,5 +8,3 @@ export default { }; export const Simple = () => ({ input: { name: 'abc', age: 20 } }); -export const Story2 = () => 'NOT A MARKO RENDER_RESULT'; -Story2.story = { name: 'with ERROR!' }; diff --git a/lib/cli/test/fixtures/react_babel_6/.babelrc b/lib/cli/test/fixtures/react_babel_6/.babelrc deleted file mode 100644 index f93c98353c11..000000000000 --- a/lib/cli/test/fixtures/react_babel_6/.babelrc +++ /dev/null @@ -1,4 +0,0 @@ -{ - "presets": ["react"], - "plugins": ["external-helpers"] -} diff --git a/lib/cli/test/fixtures/react_babel_6/index.html b/lib/cli/test/fixtures/react_babel_6/index.html deleted file mode 100644 index bcb2f9489a6f..000000000000 --- a/lib/cli/test/fixtures/react_babel_6/index.html +++ /dev/null @@ -1,11 +0,0 @@ - - - - - Hello world - - -
- - - \ No newline at end of file diff --git a/lib/cli/test/fixtures/react_babel_6/index.js b/lib/cli/test/fixtures/react_babel_6/index.js deleted file mode 100644 index 8e5bb96fc9cd..000000000000 --- a/lib/cli/test/fixtures/react_babel_6/index.js +++ /dev/null @@ -1,7 +0,0 @@ -import React from 'react'; -import ReactDOM from 'react-dom'; - -ReactDOM.render( -

Hello, world!

, - document.getElementById('root') -); diff --git a/lib/cli/test/fixtures/react_babel_6/package.json b/lib/cli/test/fixtures/react_babel_6/package.json deleted file mode 100644 index e7471988ceaf..000000000000 --- a/lib/cli/test/fixtures/react_babel_6/package.json +++ /dev/null @@ -1,23 +0,0 @@ -{ - "name": "react-babel-6-fixture", - "version": "1.0.0", - "license": "MIT", - "main": "index.js", - "scripts": { - "build": "rollup -c" - }, - "dependencies": { - "react": "^16.8.3", - "react-dom": "^16.8.3" - }, - "devDependencies": { - "babel-core": "6.26.3", - "babel-plugin-external-helpers": "6.22.0", - "babel-preset-react": "6.24.1", - "rollup": "^1.4.1", - "rollup-plugin-babel": "^4.3.2", - "rollup-plugin-commonjs": "^9.2.1", - "rollup-plugin-node-resolve": "^4.0.1", - "rollup-plugin-replace": "^2.1.0" - } -} diff --git a/lib/cli/test/fixtures/react_babel_6/rollup.config.js b/lib/cli/test/fixtures/react_babel_6/rollup.config.js deleted file mode 100644 index 2f0639d761fe..000000000000 --- a/lib/cli/test/fixtures/react_babel_6/rollup.config.js +++ /dev/null @@ -1,22 +0,0 @@ -import replace from 'rollup-plugin-replace'; -import commonjs from 'rollup-plugin-commonjs'; -import resolve from 'rollup-plugin-node-resolve'; -import babel from 'rollup-plugin-babel'; - -export default { - input: 'index.js', - output: { - file: 'dist/bundle.js', - format: 'iife' - }, - plugins: [ - replace({ - 'process.env.NODE_ENV': JSON.stringify('production') - }), - commonjs(), - resolve(), - babel({ - exclude: 'node_modules/**' // only transpile our source code - }) - ] -}; diff --git a/lib/core/package.json b/lib/core/package.json index a295b3d64d48..2877c249f8d7 100644 --- a/lib/core/package.json +++ b/lib/core/package.json @@ -27,11 +27,14 @@ "prepare": "node ../../scripts/prepare.js" }, "dependencies": { - "@babel/plugin-proposal-class-properties": "^7.7.0", - "@babel/plugin-proposal-object-rest-spread": "^7.6.2", - "@babel/plugin-syntax-dynamic-import": "^7.2.0", + "@babel/plugin-proposal-class-properties": "^7.8.3", + "@babel/plugin-proposal-export-default-from": "^7.8.3", + "@babel/plugin-proposal-object-rest-spread": "^7.8.3", + "@babel/plugin-syntax-dynamic-import": "^7.8.3", "@babel/plugin-transform-react-constant-elements": "^7.2.0", "@babel/preset-env": "^7.8.4", + "@babel/preset-react": "^7.8.3", + "@babel/preset-typescript": "^7.8.3", "@storybook/addons": "6.0.0-alpha.6", "@storybook/channel-postmessage": "6.0.0-alpha.6", "@storybook/client-api": "6.0.0-alpha.6", @@ -45,9 +48,10 @@ "airbnb-js-shims": "^2.2.1", "ansi-to-html": "^0.6.11", "autoprefixer": "^9.7.2", + "babel-loader": "^8.0.6", "babel-plugin-add-react-displayname": "^0.0.5", "babel-plugin-emotion": "^10.0.20", - "babel-plugin-macros": "^2.7.0", + "babel-plugin-macros": "^2.8.0", "babel-preset-minify": "^0.5.0 || 0.6.0-alpha.5", "boxen": "^4.1.0", "case-sensitive-paths-webpack-plugin": "^2.2.0", diff --git a/lib/core/src/server/manager/babel-loader-manager.js b/lib/core/src/server/manager/babel-loader-manager.js new file mode 100644 index 000000000000..6086275c7380 --- /dev/null +++ b/lib/core/src/server/manager/babel-loader-manager.js @@ -0,0 +1,33 @@ +import { includePaths } from '../config/utils'; + +export default () => ({ + test: /\.(mjs|tsx?|jsx?)$/, + use: [ + { + loader: require.resolve('babel-loader'), + options: { + sourceType: 'unambiguous', + presets: [ + [ + require.resolve('@babel/preset-env'), + { shippedProposals: true, useBuiltIns: 'usage', corejs: '3' }, + ], + require.resolve('@babel/preset-typescript'), + require.resolve('@babel/preset-react'), + ], + plugins: [ + [require.resolve('@babel/plugin-proposal-class-properties'), { loose: true }], + require.resolve('@babel/plugin-proposal-export-default-from'), + require.resolve('@babel/plugin-syntax-dynamic-import'), + [ + require.resolve('@babel/plugin-proposal-object-rest-spread'), + { loose: true, useBuiltIns: true }, + ], + require.resolve('babel-plugin-macros'), + ], + }, + }, + ], + include: includePaths, + exclude: [/node_module/, /dist/], +}); diff --git a/lib/core/src/server/manager/manager-webpack.config.js b/lib/core/src/server/manager/manager-webpack.config.js index 32ab49ef0768..d4a6dfb91295 100644 --- a/lib/core/src/server/manager/manager-webpack.config.js +++ b/lib/core/src/server/manager/manager-webpack.config.js @@ -12,7 +12,8 @@ import uiPaths from '@storybook/ui/paths'; import { version } from '../../../package.json'; import { getManagerHeadHtml } from '../utils/template'; import { loadEnv } from '../config/utils'; -import babelLoader from '../common/babel-loader'; + +import babelLoader from './babel-loader-manager'; import { resolvePathInStorybookCache } from '../utils/resolve-path-in-sb-cache'; const coreDirName = path.dirname(require.resolve('@storybook/core/package.json')); @@ -26,7 +27,6 @@ export default ({ dll, outputDir, cache, - babelOptions, previewUrl, versionCheck, }) => { @@ -85,7 +85,7 @@ export default ({ ].filter(Boolean), module: { rules: [ - babelLoader(babelOptions), + babelLoader(), { test: /\.css$/, use: [ diff --git a/lib/core/src/server/common/babel-loader.js b/lib/core/src/server/preview/babel-loader-preview.js similarity index 100% rename from lib/core/src/server/common/babel-loader.js rename to lib/core/src/server/preview/babel-loader-preview.js diff --git a/lib/core/src/server/preview/iframe-webpack.config.js b/lib/core/src/server/preview/iframe-webpack.config.js index fdd7aa9c30ac..ab1a1583f419 100644 --- a/lib/core/src/server/preview/iframe-webpack.config.js +++ b/lib/core/src/server/preview/iframe-webpack.config.js @@ -7,11 +7,12 @@ import WatchMissingNodeModulesPlugin from 'react-dev-utils/WatchMissingNodeModul import TerserWebpackPlugin from 'terser-webpack-plugin'; import CoreJSUpgradeWebpackPlugin from 'corejs-upgrade-webpack-plugin'; import VirtualModulePlugin from 'webpack-virtual-modules'; +import PnpWebpackPlugin from 'pnp-webpack-plugin'; import resolveFrom from 'resolve-from'; -import PnpWebpackPlugin from 'pnp-webpack-plugin'; -import createBabelLoader from '../common/babel-loader'; +import createBabelLoader from './babel-loader-preview'; + import { nodeModulesPaths, loadEnv } from '../config/utils'; import { getPreviewHeadHtml, getPreviewBodyHtml } from '../utils/template'; import { toRequireContextString } from './to-require-context'; diff --git a/yarn.lock b/yarn.lock index b7f1bfce6b99..ec2c61fc9a98 100644 --- a/yarn.lock +++ b/yarn.lock @@ -653,7 +653,7 @@ "@babel/helper-create-class-features-plugin" "^7.7.4" "@babel/helper-plugin-utils" "^7.0.0" -"@babel/plugin-proposal-class-properties@^7.1.0", "@babel/plugin-proposal-class-properties@^7.3.3", "@babel/plugin-proposal-class-properties@^7.5.5", "@babel/plugin-proposal-class-properties@^7.7.0", "@babel/plugin-proposal-class-properties@^7.8.3": +"@babel/plugin-proposal-class-properties@^7.1.0", "@babel/plugin-proposal-class-properties@^7.3.3", "@babel/plugin-proposal-class-properties@^7.5.5", "@babel/plugin-proposal-class-properties@^7.8.3": version "7.8.3" resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.8.3.tgz#5e06654af5cd04b608915aada9b2a6788004464e" integrity sha512-EqFhbo7IosdgPgZggHaNObkmO1kNUe3slaKu54d5OWvy+p9QIKOzK1GAEpAIsZtWVtPXUHSMcT4smvDrCfY4AA== @@ -705,7 +705,7 @@ "@babel/helper-plugin-utils" "^7.0.0" "@babel/plugin-syntax-export-default-from" "^7.2.0" -"@babel/plugin-proposal-export-default-from@^7.2.0", "@babel/plugin-proposal-export-default-from@^7.5.2": +"@babel/plugin-proposal-export-default-from@^7.2.0", "@babel/plugin-proposal-export-default-from@^7.5.2", "@babel/plugin-proposal-export-default-from@^7.8.3": version "7.8.3" resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-export-default-from/-/plugin-proposal-export-default-from-7.8.3.tgz#4cb7c2fdeaed490b60d9bfd3dc8a20f81f9c2e7c" integrity sha512-PYtv2S2OdCdp7GSPDg5ndGZFm9DmWFvuLoS5nBxZCgOBggluLnhTScspJxng96alHQzPyrrHxvC9/w4bFuspeA== @@ -777,7 +777,7 @@ "@babel/helper-plugin-utils" "^7.8.0" "@babel/plugin-syntax-object-rest-spread" "^7.8.0" -"@babel/plugin-proposal-object-rest-spread@^7.0.0", "@babel/plugin-proposal-object-rest-spread@^7.2.0", "@babel/plugin-proposal-object-rest-spread@^7.6.2", "@babel/plugin-proposal-object-rest-spread@^7.7.4", "@babel/plugin-proposal-object-rest-spread@^7.8.3": +"@babel/plugin-proposal-object-rest-spread@^7.0.0", "@babel/plugin-proposal-object-rest-spread@^7.2.0", "@babel/plugin-proposal-object-rest-spread@^7.7.4", "@babel/plugin-proposal-object-rest-spread@^7.8.3": version "7.8.3" resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.8.3.tgz#eb5ae366118ddca67bed583b53d7554cad9951bb" integrity sha512-8qvuPwU/xxUCt78HocNlv0mXXo0wdh9VT1R04WU8HGOfaOob26pF+9P5/lYjN/q7DHOX1bvX60hnhOvuQUJdbA== @@ -845,7 +845,7 @@ dependencies: "@babel/helper-plugin-utils" "^7.0.0" -"@babel/plugin-syntax-dynamic-import@^7.2.0", "@babel/plugin-syntax-dynamic-import@^7.7.4", "@babel/plugin-syntax-dynamic-import@^7.8.0": +"@babel/plugin-syntax-dynamic-import@^7.2.0", "@babel/plugin-syntax-dynamic-import@^7.7.4", "@babel/plugin-syntax-dynamic-import@^7.8.0", "@babel/plugin-syntax-dynamic-import@^7.8.3": version "7.8.3" resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-dynamic-import/-/plugin-syntax-dynamic-import-7.8.3.tgz#62bf98b2da3cd21d626154fc96ee5b3cb68eacb3" integrity sha512-5gdGbFon+PszYzqs83S3E5mpi7/y/8M9eC90MRTZfduQOYW76ig6SOSPNe41IG5LoP3FGBn2N0RjVDSQiS94kQ== @@ -1612,7 +1612,7 @@ "@babel/helper-plugin-utils" "^7.0.0" "@babel/plugin-transform-typescript" "^7.7.4" -"@babel/preset-typescript@^7.1.0", "@babel/preset-typescript@^7.3.3": +"@babel/preset-typescript@^7.1.0", "@babel/preset-typescript@^7.3.3", "@babel/preset-typescript@^7.8.3": version "7.8.3" resolved "https://registry.yarnpkg.com/@babel/preset-typescript/-/preset-typescript-7.8.3.tgz#90af8690121beecd9a75d0cc26c6be39d1595d13" integrity sha512-qee5LgPGui9zQ0jR1TeU5/fP9L+ovoArklEqY12ek8P/wV5ZeM/VYSQYwICeoT6FfpJTekG9Ilay5PhwsOpMHA== @@ -6247,7 +6247,7 @@ babel-plugin-macros@2.7.1: cosmiconfig "^6.0.0" resolve "^1.12.0" -babel-plugin-macros@^2.0.0, babel-plugin-macros@^2.7.0: +babel-plugin-macros@^2.0.0, babel-plugin-macros@^2.7.0, babel-plugin-macros@^2.8.0: version "2.8.0" resolved "https://registry.yarnpkg.com/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz#0f958a7cc6556b1e65344465d99111a1e5e10138" integrity sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg==