简体   繁体   English

浏览器并响应NODE_ENV进行生产

[英]browserify & react NODE_ENV for production

I want to build my js code with react and others and minify it to one file. 我想用react和其他代码构建我的js代码并将其最小化为一个文件。

It works well but I get the development version of react 它工作正常,但我得到了react的开发版本

It looks like you're using a minified copy of the development build of React

Now I know I need to add NODE_ENV = production 现在我知道我需要添加NODE_ENV = production

but I tried in so many ways and still, the build stays the same... 但我尝试了很多方法,但构建仍然保持不变...

I tried envify as you can see below, and hardcoding it like this: 正如您在下面看到的,我尝试了envify,并像这样对其进行硬编码:

process.env.NODE_ENV = 'production';

but still, not good. 但还是不好。

When I try to add envify transform, with that: 当我尝试添加envify转换时:

.transform(envify({
  'NODE_ENV': 'production'
}))

I get this error on the build: 我在生成此错误:

TypeError Path must be a string.

any ideas? 有任何想法吗?

function bundleJs() {

const _browserify = browserify({
    entries: [config.entry],
    debug : false,
    cache: {},
    packageCache: {},
    fullPaths: true,
    extensions: ['.js']
  });

  _browserify.plugin(resolutions, ['*'])
    .transform('envify', {global: true, _: 'purge', NODE_ENV: 'production'})
    .transform(hbsfy)
    .transform(babelify, {
      only: /(app)|(frontend-app)/,
      presets: ['es2015-without-strict', 'react']
    })
    .on('update', () => {
      bundle();
      gutil.log('Rebundle...');
    })
    .on('log', gutil.log);

  function bundle() {
    return bundler.bundle()
      .on('error', handleError)
      .pipe(source('init.js'))
      .pipe(rename('bundle.js'))
      .pipe(buffer())
      .pipe(gulpif(env === 'production', uglify()))
      .pipe(gulpif(env !== 'production', sourcemaps.init({ loadMaps: true })))
      .pipe(gulpif(env !== 'production', sourcemaps.write('.')))
      .pipe(gulp.dest(config.dist))
      .pipe(browserSync.reload({stream:true}));
  }

  // run it once the first time buildJs is called
  return bundle();
}

OK, so after wasting 3 hours of my life on that code. 好的,所以我在该代码上浪费了我3个小时的时间。

I noticed that the build of react is used from bower and not from npm. 我注意到react的构建是从bower中使用的,而不是从npm中使用的。

inside composer.json we had identifieres under "browser", ie: 在composer.json中,我们在“浏览器”下有标识符,即:

"react": "./bower_components/react/react.js",
"react-dom": "./bower_components/react/react-dom.js"

I assume this points directly to react dev build so that was the problem. 我认为这是直接对开发人员的开发做出反应,所以这就是问题所在。

I simply installed with npm, and all worked well. 我只是安装了npm,并且一切正常。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM