Skip to content

Minified Redux version not used in production build #156

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
maxlapides opened this issue Aug 30, 2017 · 4 comments
Closed

Minified Redux version not used in production build #156

maxlapides opened this issue Aug 30, 2017 · 4 comments
Labels
Milestone

Comments

@maxlapides
Copy link

I am using webpack to build my project that uses ng-redux. After upgrading to 3.5.0, I am seeing this message in my JavaScript console:

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.

After downgrading to 3.4.1, this message goes away. Any ideas what's going on here?

@AntJanus
Copy link
Collaborator

Thanks for bringing this up. 3.4.1 set the production environment and it was overwritten by a PR I merged in. I'll release a patch that corrects this.

@AntJanus AntJanus added this to the 3.5.1 milestone Aug 31, 2017
@deini
Copy link
Collaborator

deini commented Sep 1, 2017

@maxlapides Can you share the repo or create a small repo reproducing this?

Also how are you including the library?

@maxlapides
Copy link
Author

@deini Unfortunately, the project is closed source. But, here's my webpack config:

const path = require('path')
const webpack = require('webpack')

module.exports = {
  context: __dirname,
  entry: ['babel-polyfill', path.resolve(__dirname, 'app/index.js')],
  output: {
    filename: 'bundle-[name].min.js',
    publicPath: '',
    path: path.resolve(__dirname, './public')
  },
  resolve: {
    modules: ['node_modules'],
  },
  module: {
    rules: [
      {
        test: /\.jsx?$/,
        loader: 'babel-loader',
        options: {
          cacheDirectory: true
        }
      },
      {
        test: /\.html$/,
        include: [path.join(__dirname, './app')],
        use: [
          {
            loader: 'ngtemplate-loader',
            options: {
              relativeTo: 'app'
            }
          },
          {
            loader: 'html-loader'
          }
        ]
      },
      {
        test: /\.css$/,
        loader: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: [
            {
              loader: 'css-loader'
            },
            {
              loader: 'postcss-loader'
            }
          ]
        })
      },
      {
        test: require.resolve('angular'),
        loader: 'exports-loader',
        options: 'window.angular'
      }
    ]
  },
  plugins: [
    // force Angular to use jQuery instead of jqLite
    new webpack.ProvidePlugin({
      'window.jQuery': 'jquery'
    }),
    
    new webpack.optimize.ModuleConcatenationPlugin(),

    new HtmlWebpackPlugin({
      template: './index.html',
      inject: 'body',
      hash: true,
      minify: {
        removeComments: true,
        removeCommentsFromCDATA: true,
        removeCDATASectionsFromCDATA: true,
        collapseWhitespace: true
      },
      vars: {
        year: new Date().getFullYear()
      }
    }),

    // https://facebook.github.io/react/docs/optimizing-performance.html#use-the-production-build
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify('production')
    }),

    new webpack.optimize.UglifyJsPlugin({
      mangle: {
        except: ['$super', '$', 'exports', 'require', 'angular']
      },
      compress: {
        warnings: false
      },
      comments: false
    }),

    new ExtractTextPlugin({
      filename: 'styles-[name].css',
      disable: false,
      allChunks: true
    })
  ]
}

I am following the instructions in the README to include $ngReduxProvider

@deini
Copy link
Collaborator

deini commented Sep 1, 2017

Thanks @maxlapides I was able to reproduce it, looking into it now 👀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants