diff --git a/packages/react-scripts/config/webpack.config.js b/packages/react-scripts/config/webpack.config.js index 771b06c94d17d3b93008b14d6080f0dcb1caf240..fa796518fd8972b495fc2c314646908df09f57e5 100644 --- a/packages/react-scripts/config/webpack.config.js +++ b/packages/react-scripts/config/webpack.config.js @@ -86,6 +86,15 @@ module.exports = function(webpackEnv) { const getStyleLoaders = (cssOptions, preProcessor) => { const loaders = [ isEnvDevelopment && require.resolve('style-loader'), + useTypeScript && + isEnvDevelopment && + cssOptions.modules && { + loader: require.resolve('dts-css-modules-loader'), + options: { + banner: + '// This file is generated automatically by dts-css-modules-loader', + }, + }, isEnvProduction && { loader: MiniCssExtractPlugin.loader, options: shouldUseRelativeAssetPaths ? { publicPath: '../../' } : {}, diff --git a/packages/react-scripts/package.json b/packages/react-scripts/package.json index a15c92d03f43431b9dc46d17d3ebf9667b365b88..1f560f80a4844f23c05b14d81bd93f4d5be60e14 100644 --- a/packages/react-scripts/package.json +++ b/packages/react-scripts/package.json @@ -42,6 +42,7 @@ "css-loader": "2.1.1", "dotenv": "6.2.0", "dotenv-expand": "4.2.0", + "dts-css-modules-loader": "^1.0.1", "eslint": "^5.16.0", "eslint-config-react-app": "^4.0.1", "eslint-loader": "2.1.2",