【问题标题】:Redux NODE_ENV errors with Gulp/BrowserifyGulp/Browserify 的 Redux NODE_ENV 错误
【发布时间】:2016-11-30 06:23:20
【问题描述】:

我在使用 Browserify 和 Gulp 压缩并打包并部署到 Heroku 的 React/Redux 应用程序上收到此错误消息。

bundle.js:39 You are currently using minified code outside of NODE_ENV === 'production'. This means that you are running a slower development build of Redux.

但似乎构建步骤正在NODE_ENV = 'production' 中完成。

我有一个像这样设置环境变量的任务

gulp.task('apply-prod-environment', function() {
  return process.env.NODE_ENV = 'production';
});

Heroku 上的日志显示 ENV 正在生产中:

为了保证apply-prod-environment 在其他任务之前运行,我使用了RunSequence Gulp 插件。

gulp.task('buildProd', cb => {
  runSequence(
    'apply-prod-environment',
    'task-1',
    'task-2',
    'etc',
    cb
  );
});

编辑
第二次尝试..

import envify from 'envify/custom';

function buildJS(sourceFile, {setEnv}) {
  return browserify(sourceFile)
    .transform(babelify, {
      presets: ['es2015', 'react', 'stage-2']
    })
    .transform(envify({
      NODE_ENV: setEnv
    }))
    .bundle()
    .on('error', (e) =>  {
      gutil.log(e);
    });
}

仍然出现同样的错误

第三次尝试..

function buildJS(sourceFile, {setEnv}) {
  return browserify(sourceFile)
    .transform(babelify, {
      presets: ['es2015', 'react', 'stage-2']
    })
    .transform(
      {global: true},
      envify({
        NODE_ENV: setEnv
      })
    )
    .bundle()
    .on('error', (e) =>  {
      gutil.log(e);
    });
}

仍然出现同样的错误

【问题讨论】:

标签: javascript reactjs gulp redux browserify


【解决方案1】:

我在同样的问题上苦苦挣扎,最终使用loose-envify 模拟我想要覆盖的环境变量。

然后,我的 gulp 任务如下所示:

gulp.task('javascript:prod', function() {
return browserify("app/main.js", { debug: !IS_PROD })
    .transform("babelify", { presets: [ "es2015", "react" ], plugins: [ "transform-object-rest-spread", "transform-function-bind", "transform-object-assign" ] })
    .transform('loose-envify', { NODE_ENV: 'production' })
    .bundle()
    .pipe(source('app.js'))
    .pipe(buffer())
    .pipe(uglify())
    .pipe(rev())
    .pipe(gulp.dest("./public/javascripts/"))
    .pipe(rev.manifest({merge:true, base: 'build/assets'}))
    .pipe(gulp.dest('build/assets'));
});

【讨论】:

  • 嗯。这仍然不起作用。还有什么需要修复的吗?
  • 我不记得我做了什么,因为那是几个月前的事了。您知道 Heroku 是否将您的“buildProd”任务作为构建包的一部分运行?或者你是在本地运行它,然后推送预先构建的文件?
  • buildProd 任务正在 Heroku 上运行。构建日志说它正在“生产”中运行。
  • 几个问题... 1) 你知道你在 Heroku 上使用的是哪个构建包吗? 2) 你在 package.json 中的 dependencies 或 devDependencies 下是否列出了 Webpack、Babel 和 loader?我假设它们处于依赖关系下,因为 ReactJS 实际上正在编译。我的猜测是您的 gulp 文件中存在不正确的内容,或者 Heroku 构建包正在使用不同的 ENV 而非生产环境运行 gulp 任务。
  • 使用节点构建包。使用 Gulp / Browserify 而不是 Webpack。大多数依赖项都在依赖项而不是 devDependencies 中,因此我们可以在 Heroku 上运行构建(以及 CI 等其他东西)。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-10-02
  • 2016-07-15
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多