/* eslint-disable max-len, no-console, import/no-extraneous-dependencies */ import path from 'path'; import config from 'config'; import webpack from 'webpack'; import WebpackIsomorphicToolsPlugin from 'webpack-isomorphic-tools/plugin'; import { getPlugins, getRules } from './webpack-common'; import webpackConfig from './webpack.prod.config.babel'; import webpackIsomorphicToolsConfig from './src/amo/server/webpack-isomorphic-tools-config'; import { WEBPACK_ENTRYPOINT } from './src/amo/constants'; const localDevelopment = config.util.getEnv('NODE_ENV') === 'development'; const webpackIsomorphicToolsPlugin = new WebpackIsomorphicToolsPlugin( webpackIsomorphicToolsConfig, ); const babelConfig = require('./babel.config'); const babelPlugins = babelConfig.plugins || []; const babelDevPlugins = ['react-hot-loader/babel']; export const babelOptions = { ...babelConfig, plugins: localDevelopment ? babelPlugins.concat(babelDevPlugins) : babelPlugins, }; const hmr = `webpack-hot-middleware/client?path=${config.get( 'staticPath', )}__webpack_hmr`; const entryPoints = { [WEBPACK_ENTRYPOINT]: [hmr, 'amo/client'] }; // We do not want the production optimization settings in development. delete webpackConfig.optimization; export default { ...webpackConfig, mode: 'development', devtool: 'cheap-module-source-map', context: path.resolve(__dirname), entry: entryPoints, output: { ...webpackConfig.output, filename: '[name]-[contenthash].js', chunkFilename: '[name]-[contenthash].js', // We need to remove the protocol because of `yarn amo:dev-https`. publicPath: config.get('staticPath'), }, module: { rules: getRules({ babelOptions, bundleStylesWithJs: true }), }, plugins: [ ...getPlugins(), // Load unminified React and Redux in development to get better error // messages, because they use // [Invariant](https://github.com/zertosh/invariant) which hides error // messages in the production build. // // We can no longer load the React versions from /umd/ as it no longer // exists. // See https://github.com/mozilla/addons-frontend/issues/11737 // new webpack.NormalModuleReplacementPlugin( // /^react$/, // 'react/umd/react.development.js', // ), // new webpack.NormalModuleReplacementPlugin( // /^react-dom$/, // 'react-dom/umd/react-dom.development.js', // ), new webpack.NormalModuleReplacementPlugin(/^redux$/, 'redux/dist/redux.js'), new webpack.HotModuleReplacementPlugin(), new webpack.IgnorePlugin({ resourceRegExp: /webpack-stats\.json$/ }), webpackIsomorphicToolsPlugin.development(), ], };