1

i created react app and i need to have 3 node_env:

"start": "cross-env NODE_ENV=development webpack serve",
"build-accept": "cross-env NODE_ENV=accept webpack",
"build-production": "cross-env NODE_ENV=production webpack"

When i deploy my app to accept environment, it says You are currently using minified code outside of NODE_ENV === 'production'. This means that you are running a slower development build of Redux

But i need this to run on accept mode. There are different api endpoints for accept and production.

How can i fix it?

Here's my webpack code:

const HtmlPlugin = require('html-webpack-plugin');
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const path = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const webpack = require('webpack');

module.exports = {
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: '[name].[contenthash].js',
    publicPath: '/',
  },
  optimization: {
    runtimeChunk: 'single',
    splitChunks: {
      cacheGroups: {
        vendor: {
          test: /[\\/]node_modules[\\/]/,
          name: 'vendors',
          chunks: 'all',
        },
      },
    },
  },
  resolve: {
    extensions: ['.ts', '.tsx', '.js', '.jsx'],
  },
  module: {
    rules: [
      {
        test: /\.(js|jsx|ts|tsx)$/,
        exclude: /node_modules/,
        use: [
          {
            loader: 'babel-loader',
          },
        ],
      },
      {
        test: /\.html$/,
        use: [
          {
            loader: 'html-loader',
          },
        ],
      },
      {
        test: /\.(png|jpe?g|gif)$/i,
        use: [
          {
            loader: 'file-loader',
          },
        ],
      },
      {
        test: /\.s[ac]ss$/i,
        use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
      },
    ],
  },

  plugins: [
    new HtmlPlugin({
      filename: 'index.html',
      template: './public/index.html',
    }),
    new MiniCssExtractPlugin(),
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development'),
    }),
    new CopyWebpackPlugin({
      patterns: [
        { from: 'static' },
      ],
    }),
    // new BundleAnalyzerPlugin(),
  ],
};

Marek
  • 125
  • 1
  • 1
  • 10
  • Does this answer your question? [You are currently using minified code outside of NODE\_ENV === 'production'. This means that you are running a slower development build of Redux](https://stackoverflow.com/questions/43694367/you-are-currently-using-minified-code-outside-of-node-env-production-this) – hppycoder Mar 05 '21 at 18:07
  • No, becouse i cant set NODE_ENV to production in this case. It needs to be accept. – Marek Mar 05 '21 at 18:10
  • 1
    If this is not a production, you, probably, should be ok with slower redux. Anyway, it is not good idea to use NODE_ENV for something besides "development", "test" and "production". When you want different production deployments it is better to use deployment specific variables, not something so widely used for distinguishing production from development – Mr. Hedgehog Mar 05 '21 at 18:28
  • @ezhikov thanks. Finally what i did i created 3 webpack scripts, each one for developmend, accept and production mode based on documentation https://webpack.js.org/guides/production/ – Marek Mar 06 '21 at 16:59

0 Answers0