diff --git a/packages/storybook/package.json b/packages/storybook/package.json index 89efb585bf..51718f78fe 100644 --- a/packages/storybook/package.json +++ b/packages/storybook/package.json @@ -33,8 +33,8 @@ "@storybook/react": "^5.2.5", "@storybook/web": "^5.2.5", "@storybook/addon-knobs": "^5.2.5", - "babel-loader": "^7.5.4", - "@babel/core": "^8.0.6" + "babel-loader": "^8.0.6", + "@babel/core": "^7.5.4" }, "dependencies": { "@nrwl/cypress": "*", @@ -42,8 +42,6 @@ "tree-kill": "1.2.1", "ts-loader": "5.3.1", "tsconfig-paths-webpack-plugin": "3.2.0", - "webpack-node-externals": "1.7.2", - "to-string-loader": "^1.1.5", - "html-loader": "^0.5.5" + "webpack-node-externals": "1.7.2" } } diff --git a/packages/storybook/src/schematics/configuration/lib-files/.storybook/webpack.config.js__tmpl__ b/packages/storybook/src/schematics/configuration/lib-files/.storybook/webpack.config.js__tmpl__ index e38dde6c55..50e725e6c9 100644 --- a/packages/storybook/src/schematics/configuration/lib-files/.storybook/webpack.config.js__tmpl__ +++ b/packages/storybook/src/schematics/configuration/lib-files/.storybook/webpack.config.js__tmpl__ @@ -3,6 +3,7 @@ const rootWebpackConfig = require('<%= offsetFromRoot %>../.storybook/webpack.co module.exports = async ({ config, mode }) => { config = await rootWebpackConfig({ config, mode }); <% if(uiFramework === '@storybook/react') { %> + config.resolve.extensions.push('.tsx'); config.module.rules.push({ test: /\.(ts|tsx)$/, loader: require.resolve('babel-loader'), diff --git a/packages/storybook/src/schematics/configuration/root-files/.storybook/webpack.config.js b/packages/storybook/src/schematics/configuration/root-files/.storybook/webpack.config.js index a90baaa82b..c718e76b0e 100644 --- a/packages/storybook/src/schematics/configuration/root-files/.storybook/webpack.config.js +++ b/packages/storybook/src/schematics/configuration/root-files/.storybook/webpack.config.js @@ -4,37 +4,7 @@ module.exports = async ({ config, mode }) => { // You can change the configuration based on that. // 'PRODUCTION' is used when building the static version of storybook. - r = config.module.rules.filter(rule => rule.test != '/\\.css$/'); - // Make whatever fine-grained changes you need - r.push({ - test: /\.css$/, - use: [ - 'to-string-loader', - { - loader: 'style-loader' - }, - { - loader: 'css-loader', - options: { - sourceMap: true - } - } - ] - }); - - config.module.rules = r; - config.resolve.extensions.push('.tsx'); - - let scssLoader = config.module.rules.find(i => !!'a.scss'.match(i.test)); - if (scssLoader && scssLoader.use) { - scssLoader.use = ['to-string-loader', ...scssLoader.use]; - } - - let htmlLoader = config.module.rules.find(i => !!'a.html'.match(i.test)); - if (htmlLoader) { - htmlLoader.loader = 'html-loader'; - } // Return the altered config return config; diff --git a/packages/storybook/src/schematics/init/init.ts b/packages/storybook/src/schematics/init/init.ts index a13c4394cb..fba801f90a 100644 --- a/packages/storybook/src/schematics/init/init.ts +++ b/packages/storybook/src/schematics/init/init.ts @@ -30,10 +30,7 @@ function checkDependenciesInstalled(): Rule { { name: '@storybook/react', version: storybookVersion }, { name: '@storybook/addon-knobs', version: storybookVersion }, { name: 'babel-loader', version: babelLoaderVersion }, - { name: '@babel/core', version: babelCoreVersion }, - { name: 'to-string-loader', version: '*' }, - { name: 'html-loader', version: '*' }, - { name: 'css-loader', version: '*' } + { name: '@babel/core', version: babelCoreVersion } ); } if (