CODEWITHSUNDEEP
javascriptreactjsgulpbrowserify
Tzook Bar Noy
Tzook Bar Noy

Reputation: 11677

browserify & react NODE_ENV for production

I want to build my js code with react and others and minify it to one file.

It works well but I get the development version of 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

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:

process.env.NODE_ENV = 'production';

but still, not good.

When I try to add envify transform, with that:

.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();
}

Upvotes: 0

Views: 599

Answers (1)

Tzook Bar Noy
Tzook Bar Noy

Reputation: 11677

OK, so after wasting 3 hours of my life on that code.

I noticed that the build of react is used from bower and not from npm.

inside composer.json we had identifieres under "browser", ie:

"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.

Upvotes: 1

Related Questions