NODE_ENV=production browserify src/main.js -t babelify -g envify -v -p bundle-collapser/plugin -p [minifyify --no-map --uglify [ --compress [ --dead_code ] --mangle ] ] | uglifyjs -m -e -c dead_code,screw-ie8,warnings=false > build/bundle.jsBut passing all the uglify options twice feels wrong.
I would like it to look more like:
watchify src/main.js -t babelify -g envify -p uglify -o build/bundle.js -v
@terinjokes Hmm. kk. In the mean time, do you have any recommendations for looking into this that might require a bit more mucking? I’m curious if browserify is slow because of babelify on our codebase, or just because there are purely a lot of files it has to process, or because it is pulling in really large packages like react. I have no idea how to track down where it is spending it’s time.
I used chrome’s dev tools to create some flame charts of the node process, but it didn’t seem to help point me in the right direction
@terinjokes Flame charts appear to tell me is that it was spending a lot of time reading files but I couldn’t figure out what files or what part of the stack it was. Whether it was node requiring files, or loading up babel’s deps, or something else. It sounds like you don’t have any magic bullets or grand suggesstions though and that I should keep digging
gulp.task('js:compile', function() {
return browserify([ deployDir + '/js/pages/newModelVisualization.js'
], { debug: true })
.transform(babelify,{presets: [__dirname + "/node_modules/babel-preset-es2015-nostrict"]})
.bundle()
.pipe(source('modelerWizardFlow-min.js'))
.pipe(gulp.dest('.'))
})
I get an error like this:
events.js:160
throw er; // Unhandled 'error' event
^
Error: Cannot find module 'underscore' from '/home/velvet/tf/src-docroot/js/lib'
at /home/velvet/tf/frontend/node_modules/resolve/lib/async.js:46:17
at process (/home/velvet/tf/frontend/node_modules/resolve/lib/async.js:173:43)
at ondir (/home/velvet/tf/frontend/node_modules/resolve/lib/async.js:188:17)
at load (/home/velvet/tf/frontend/node_modules/resolve/lib/async.js:69:43)
at onex (/home/velvet/tf/frontend/node_modules/resolve/lib/async.js:92:31)
at /home/velvet/tf/frontend/node_modules/resolve/lib/async.js:22:47
at FSReqWrap.oncomplete (fs.js:123:15)
but it exists in that folder. I'm importing it as a relative path like
import { _ } from './lib/underscore.js'
and when I run flow it doesn't complain that the module doesn't exist
what am I doing wrong? did I configure this wrong? how can I get browserify to at least tell me which file is giving it the error?
like I'd love to simply ask it to resolve
require('my-project') to /local/path/to/my-project
I'm packaging an npm module with browserify. But it only works if I turn on uglification. If I don't then, when I import that module into my app and pack the main app (again with browserify), that second pack fails to find the dependencies that the npm module has (e.g.
ERROR: Cannot find module './modules/es6.string.fontsize' )
the npm module is packed with browserify. None of its require statements should be followed by the second browserify.
browserify is still awesome.
I was making a card for my dad for fathers day, in code of course, & since I spent a fair bit the time on the card, I didn't have any to waste on a build system.
browserify -t [ browserify-css --autoInject=true ] --entry js/main.js -o index.browserified.js
index file with all the codes, full of the win.
