const {resolve} = require('path'); const {DefinePlugin} = require('webpack'); const { DARK_MODE_DIMMED_WARNING_COLOR, DARK_MODE_DIMMED_ERROR_COLOR, DARK_MODE_DIMMED_LOG_COLOR, LIGHT_MODE_DIMMED_WARNING_COLOR, LIGHT_MODE_DIMMED_ERROR_COLOR, LIGHT_MODE_DIMMED_LOG_COLOR, GITHUB_URL, getVersionString, } = require('react-devtools-extensions/utils'); const {resolveFeatureFlags} = require('react-devtools-shared/buildUtils'); const NODE_ENV = process.env.NODE_ENV; if (!NODE_ENV) { console.error('NODE_ENV not set'); process.exit(1); } const TARGET = process.env.TARGET; if (!TARGET) { console.error('TARGET not set'); process.exit(1); } const EDITOR_URL = process.env.EDITOR_URL || null; const builtModulesDir = resolve( __dirname, '..', '..', 'build', 'oss-experimental', ); const __DEV__ = NODE_ENV === 'development'; const DEVTOOLS_VERSION = getVersionString(); const config = { mode: __DEV__ ? 'development' : 'production', devtool: __DEV__ ? 'cheap-source-map' : 'source-map', entry: { 'app-index': './src/app/index.js', 'app-devtools': './src/app/devtools.js', 'multi-left': './src/multi/left.js', 'multi-devtools': './src/multi/devtools.js', 'multi-right': './src/multi/right.js', }, node: { // source-maps package has a dependency on 'fs' // but this build won't trigger that code path fs: 'empty', }, resolve: { alias: { react: resolve(builtModulesDir, 'react'), 'react-debug-tools': resolve(builtModulesDir, 'react-debug-tools'), 'react-devtools-feature-flags': resolveFeatureFlags('shell'), 'react-dom': resolve(builtModulesDir, 'react-dom/unstable_testing'), 'react-is': resolve(builtModulesDir, 'react-is'), scheduler: resolve(builtModulesDir, 'scheduler'), }, }, optimization: { minimize: false, }, plugins: [ new DefinePlugin({ __DEV__, __EXPERIMENTAL__: true, __EXTENSION__: false, __PROFILE__: false, __TEST__: NODE_ENV === 'test', 'process.env.GITHUB_URL': `"${GITHUB_URL}"`, 'process.env.EDITOR_URL': EDITOR_URL != null ? `"${EDITOR_URL}"` : null, 'process.env.DEVTOOLS_PACKAGE': `"react-devtools-shell"`, 'process.env.DEVTOOLS_VERSION': `"${DEVTOOLS_VERSION}"`, 'process.env.DARK_MODE_DIMMED_WARNING_COLOR': `"${DARK_MODE_DIMMED_WARNING_COLOR}"`, 'process.env.DARK_MODE_DIMMED_ERROR_COLOR': `"${DARK_MODE_DIMMED_ERROR_COLOR}"`, 'process.env.DARK_MODE_DIMMED_LOG_COLOR': `"${DARK_MODE_DIMMED_LOG_COLOR}"`, 'process.env.LIGHT_MODE_DIMMED_WARNING_COLOR': `"${LIGHT_MODE_DIMMED_WARNING_COLOR}"`, 'process.env.LIGHT_MODE_DIMMED_ERROR_COLOR': `"${LIGHT_MODE_DIMMED_ERROR_COLOR}"`, 'process.env.LIGHT_MODE_DIMMED_LOG_COLOR': `"${LIGHT_MODE_DIMMED_LOG_COLOR}"`, }), ], module: { rules: [ { test: /\.js$/, loader: 'babel-loader', options: { configFile: resolve( __dirname, '..', 'react-devtools-shared', 'babel.config.js', ), }, }, { test: /\.css$/, use: [ { loader: 'style-loader', }, { loader: 'css-loader', options: { sourceMap: true, modules: true, localIdentName: '[local]', }, }, ], }, ], }, }; if (TARGET === 'local') { // Local dev server build. config.devServer = { hot: true, port: 8080, clientLogLevel: 'warning', publicPath: '/dist/', stats: 'errors-only', }; } else { // Static build to deploy somewhere else. config.output = { path: resolve(__dirname, 'dist'), filename: '[name].js', }; } module.exports = config;