You are currently using minified code outside of NODE_ENV === > 'production'

Question

"You are currently using minified code outside of NODE_ENV === 'production'. This means that you are running a slower development build of Redux. You can use loose-envify (https://github.com/zertosh/loose-envify) for browserify or DefinePlugin for webpack (http://stackoverflow.com/questions/30030031) to ensure you have the correct code for your production build."

I get this error when i try to run my application in react native, i don't know how to solve this error and i have been searched solution in google. but i still get this error

go through this Q/A exchange for better understanding: https://stackoverflow.com/questions/43694367/you-are-currently-using-minified-code-outside-of-node-env-production-this — Jayabalaji J, Nov 10 '17 at 07:21

score 1 · Answer 1 · answered Aug 24 '19 at 00:24

1

I had the same issue. If you are using expo to create a react native app, check the .expo folder in settings.json:

{ 
  //you should have setted 
  minified: false,
  //when is 
  dev: true
}

That solve my issue

answered Aug 24 '19 at 00:24

guiwme5

712
6
10

score 0 · Answer 2 · answered Nov 10 '17 at 07:25

0

You can add this configuration to your webpack.config,js to get rid of this warning temporarily,

new webpack.DefinePlugin({
    'process.env.NODE_ENV': JSON.stringify('production')
})

answered Nov 10 '17 at 07:25

Jayabalaji J

1,016
7
9

there is no webpack.config.js file sir what should i do? – Wahyu Setiawan Nov 10 '17 at 07:26
ouch..so what module bundler do your application use ? – Jayabalaji J Nov 10 '17 at 07:28
i don't really understand sir, sorry what kind of module? – Wahyu Setiawan Nov 10 '17 at 07:31
Thank you sir, i think i have get the answer here, it cause my emulator got the wrong settings. – Wahyu Setiawan Nov 10 '17 at 07:42
glad you got the answer:-) – Jayabalaji J Nov 10 '17 at 07:43

score 0 · Answer 3 · answered Nov 10 '17 at 07:53

you can define node env in your script. based on that you switch on the plugins

ex in development you don't need to minify the code. but in production it should be minified. and you don't need HOT LOADER in production and vice versa. so it's better to define the node ENV variables and based on it do the switch.

this is how you define it.

new webpack.DefinePlugin({
    'process.env.NODE_ENV': JSON.stringify('production')
})

based on this env you can have more/less plugins to act on your codebase this is my common webpackconfig based on env.

below is my reactjs config condition check. you can apply simler concept to Native

const env=process.env.NODE_ENV;
const isProd = (env.toLowerCase().trim()=== 'production' || env.toLowerCase().trim() === 'staging')? true: false;
if (isProd) {
 //config.plugins will have all common plugin for both dev and prod
  Array.prototype.push.apply(config.plugins, [
    new webpack.optimize.UglifyJsPlugin({ sourceMap: true }),
    new webpack.optimize.OccurrenceOrderPlugin(),
    new webpack.optimize.AggressiveMergingPlugin(),
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendors',
      minChunks(module) {
        const { context } = module;
        if (typeof context !== 'string') {
          return false;
        }
        return context.indexOf('node_modules') !== -1;
      },
    }),
    new webpack.optimize.CommonsChunkPlugin({
      name: 'common',
      minChunks(module, count) {
        return count >= 2;
      },
    }),
    new CompressionPlugin({
      asset: '[path].gz[query]',
      algorithm: 'gzip',
      test: /\.(js|html)$/,
      threshold: 10240,
      minRatio: 0.8,
    }),
    new webpack.LoaderOptionsPlugin({
      minimize: true,
      debug: false,
      noInfo: true,
      options: {
        context: './',
      },
    }),
    new HtmlWebpackPlugin({
      title: 'React App',
      filename: 'index.html',
      template: './src/index.ejs',
      favicon: './src/favicon.ico',
      minify: {
        removeComments: true,
        collapseWhitespace: true,
        removeRedundantAttributes: true,
        useShortDoctype: true,
        removeEmptyAttributes: true,
        removeStyleLinkTypeAttributes: true,
        keepClosingSlash: true,
        minifyJS: true,
        minifyCSS: true,
        minifyURLs: true,
      },
      inject: true,
    }),
  ]);
} else {
  config.entry.splice(1, 0, 'react-hot-loader/patch');
  Array.prototype.push.apply(config.plugins, [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NamedModulesPlugin(),
    new HtmlWebpackPlugin({
      title: 'React App',
      filename: 'index.html',
      template: './src/index.ejs',
      inject: true,
      favicon: './src/favicon.ico',
    }),
    new webpack.LoaderOptionsPlugin({
      minimize: false,
      debug: true,
      noInfo: false,
      options: {
        context: './',
      },
    }),
  ]);
}

You are currently using minified code outside of NODE_ENV === > 'production'

3 Answers3