diff --git a/config/paths.js b/config/paths.js index 2efd3b7..cffa1f0 100644 --- a/config/paths.js +++ b/config/paths.js @@ -41,7 +41,7 @@ function getServedPath(appPackageJson) { // config after eject: we're in ./config/ module.exports = { dotenv: resolveApp('.env'), - appBuild: resolveApp('build'), + appBuild: resolveApp('lib'), appPublic: resolveApp('public'), appHtml: resolveApp('public/index.html'), appIndexJs: resolveApp('src/index.js'), diff --git a/config/webpack.config.dev.js b/config/webpack.config.dev.js index 5b56219..04e535e 100644 --- a/config/webpack.config.dev.js +++ b/config/webpack.config.dev.js @@ -185,8 +185,8 @@ module.exports = { loader: require.resolve('css-loader'), options: { importLoaders: 1, - // modules: true, -   // localIdentName: '[name]_[local]_[hash:base64:5]' + modules: true, +   localIdentName: '[name]_[local]_[hash:base64:5]' }, }, { diff --git a/config/webpack.config.prod.js b/config/webpack.config.prod.js index 60b6aec..6782430 100644 --- a/config/webpack.config.prod.js +++ b/config/webpack.config.prod.js @@ -2,16 +2,8 @@ const autoprefixer = require('autoprefixer'); const path = require('path'); -const webpack = require('webpack'); -const HtmlWebpackPlugin = require('html-webpack-plugin'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); -const ManifestPlugin = require('webpack-manifest-plugin'); -const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin'); -const SWPrecacheWebpackPlugin = require('sw-precache-webpack-plugin'); -const eslintFormatter = require('react-dev-utils/eslintFormatter'); -const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin'); const paths = require('./paths'); -const getClientEnvironment = require('./env'); // Webpack uses `publicPath` to determine where the app is being served from. // It requires a trailing slash, or the file assets will get an incorrect path. @@ -19,18 +11,6 @@ const publicPath = paths.servedPath; // Some apps do not use client-side routing with pushState. // For these, "homepage" can be set to "." to enable relative asset paths. const shouldUseRelativeAssetPaths = publicPath === './'; -// `publicUrl` is just like `publicPath`, but we will provide it to our app -// as %PUBLIC_URL% in `index.html` and `process.env.PUBLIC_URL` in JavaScript. -// Omit trailing slash as %PUBLIC_URL%/xyz looks better than %PUBLIC_URL%xyz. -const publicUrl = publicPath.slice(0, -1); -// Get environment variables to inject into our app. -const env = getClientEnvironment(publicUrl); - -// Assert this just to be safe. -// Development builds of React are slow and not intended for production. -if (env.stringified['process.env'].NODE_ENV !== '"production"') { - throw new Error('Production builds must have NODE_ENV=production.'); -} // Note: defined here because it will be used more than once. const cssFilename = 'static/css/[name].[contenthash:8].css'; @@ -54,7 +34,7 @@ module.exports = { // You can exclude the *.map files from the build during deployment. devtool: 'source-map', // In production, we only want to load the polyfills and the app code. - entry: [require.resolve('./polyfills'), paths.appIndexJs], + entry: paths.appIndexJs, output: { // The build folder. path: paths.appBuild, @@ -70,14 +50,6 @@ module.exports = { path.relative(paths.appSrc, info.absoluteResourcePath), }, resolve: { - // This allows you to set a fallback for where Webpack should look for modules. - // We placed these paths second because we want `node_modules` to "win" - // if there are any conflicts. This matches Node resolution mechanism. - // https://github.com/facebookincubator/create-react-app/issues/253 - modules: ['node_modules', paths.appNodeModules].concat( - // It is guaranteed to exist because we tweak it in `env.js` - process.env.NODE_PATH.split(path.delimiter).filter(Boolean) - ), // These are the reasonable defaults supported by the Node ecosystem. // We also include JSX as a common component filename extension to support // some tools, although we do not recommend using it, see: @@ -89,46 +61,10 @@ module.exports = { 'react-native': 'react-native-web', 'ps-react': path.resolve(__dirname, '../src/components') }, - plugins: [ - // Prevents users from importing files from outside of src/ (or node_modules/). - // This often causes confusion because we only process files within src/ with babel. - // To fix this, we prevent you from importing files out of src/ -- if you'd like to, - // please link the files into your node_modules/ and let module-resolution kick in. - // Make sure your source files are compiled, as they will not be processed in any way. - // new ModuleScopePlugin(paths.appSrc), - ], }, module: { strictExportPresence: true, rules: [ - // TODO: Disable require.ensure as it's not a standard language feature. - // We are waiting for https://github.com/facebookincubator/create-react-app/issues/2176. - // { parser: { requireEnsure: false } }, - - // First, run the linter. - // It's important to do this before Babel processes the JS. - { - test: /\.(js|jsx)$/, - enforce: 'pre', - use: [ - { - options: { - formatter: eslintFormatter, - - }, - loader: require.resolve('eslint-loader'), - }, - ], - include: paths.appSrc, - }, - // ** ADDING/UPDATING LOADERS ** - // The "file" loader handles all assets unless explicitly excluded. - // The `exclude` list *must* be updated with every change to loader extensions. - // When adding a new loader, you must add its `test` - // as a new entry in the `exclude` list in the "file" loader. - - // "file" loader makes sure those assets end up in the `build` folder. - // When you `import` an asset, you get its filename. { exclude: [ /\.html$/, @@ -140,27 +76,17 @@ module.exports = { /\.jpe?g$/, /\.png$/, ], - loader: require.resolve('file-loader'), - options: { - name: 'static/media/[name].[hash:8].[ext]', - }, - }, - // "url" loader works just like "file" loader but it also embeds - // assets smaller than specified size as data URLs to avoid requests. - { - test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/], - loader: require.resolve('url-loader'), + loader: require.resolve('null-loader'), options: { - limit: 10000, name: 'static/media/[name].[hash:8].[ext]', }, }, - // Process JS with Babel. - { + // Process JS with Babel. + { test: /\.(js|jsx)$/, include: paths.appSrc, loader: require.resolve('babel-loader'), - + }, // The notation here is somewhat confusing. // "postcss" loader applies autoprefixer to our CSS. @@ -187,6 +113,7 @@ module.exports = { importLoaders: 1, minimize: true, sourceMap: true, + modules: true, }, }, { @@ -219,98 +146,9 @@ module.exports = { ], }, plugins: [ - // Makes some environment variables available in index.html. - // The public URL is available as %PUBLIC_URL% in index.html, e.g.: - // - // In production, it will be an empty string unless you specify "homepage" - // in `package.json`, in which case it will be the pathname of that URL. - new InterpolateHtmlPlugin(env.raw), - // Generates an `index.html` file with the