browserify

browserify and document ready?

由 泪湿孤枕 提交于 2019-12-03 16:50:04
问题 I'm struggling with using Browserify and document ready events. How do I craft a module that exports content only available after the document ready event has fired? How do I depend on such a module? My first stab was to try to set module.exports asynchronously -- fail out of the box. My nextx stab at this was for the module to return a function that took in a callback, and called the callback when document ready fired. Third attempt returned a promise. This seems to make dependent modules

Error using Bootstrap & jQuery Packages in ES6 with Browserify

由 ￡可爱￡侵袭症＋ 提交于 2019-12-03 16:29:22
问题 I'm trying to use Bootstrap with jQuery. I'm using Browserify with a Babel transform to compile. I get the following error. Uncaught ReferenceError: jQuery is not defined I've tried importing the packages like this, but I get the above error. import $ from 'jquery'; import Bootstrap from 'bootstrap'; Searching around, I found this answer, so I tried this but I still get the same error. import $ from 'jquery'; window.$ = window.jQuery = $; import Bootstrap from 'bootstrap'; Bootstrap.$ = $; Am

How to keep Browserify bundle size sensible when using requires for thirdparty stuff (via grunt if it matters)

由 本秂侑毒 提交于 2019-12-03 15:58:41
I'm trying to bundle up my own code (A) which in turn uses 2 third party components (B and C) where C also needs B. Everything as far as I know is written using CommonJS node style modules. A on its own when bundled comes out at 60K. B is included separately and assumed to be global, I've got this working just fine by doing a dirty bit of a replace in my build step that swaps out require("B") with global.B C is whats causing me issues though, its meant to be "just 8K" in size yet when I try bundling it up with A my bundle jumps up to 600K+ as I assume its pulling in dependancies galore? This

How to do code coverage with karma, typescript, and browserify

由 帅比萌擦擦* 提交于 2019-12-03 15:16:48
问题 How do you setup karma test runner to generate code coverage reports of a typescript project? Given the following folder structure and karma.conf.js file I'm already using karma to run my tests written in TypeScript. I already fiddled around with karma-coverage and remap-istanbul but without any luck yet. If possible I'd like to do it without any additional npm scripts . . ├── karma.conf.js ├── package.json ├── src │ └── add.ts ├── test │ └── addSpec.ts ├── tsconfig.json ├── typings │ ├──

Exporting a class with ES6 (Babel)

由 那年仲夏 提交于 2019-12-03 14:37:21
问题 I'm writing some frontend code with ECMAScript 6 (transpiled with BabelJS, and then browserified with Browserify) so that I can have a class in one file, export it and import it in another file. The way I'm doing this is: export class Game { constructor(settings) { ... } } And then on the file that imports the class I do: import {Game} from "../../lib/pentagine_browserified.js"; var myGame = new Game(settings); I then compile it with grunt , this is my Gruntfile : module.exports = function

using jquery with browserify

由 三世轮回 提交于 2019-12-03 14:13:04
I am trying to use jQuery with browserify with the module jquery-browserify. I required the module in my client.js script as such: var $ = require('jquery-browserify'); and when I run my node server, after i've ran browserify, i get a "window is not defined" error. What am I doing wrong? Browserify can process CommonJS modules as well as AMD modules with the deamdify transform so now there should be no need to use a shim. To be clear I only noticed AMD support in JQuery 2.0.0 jQuery is now CommonJS compliant, as of version 2.1.0 Thorsten Lorenz jQuery was not CommonJS compliant, i.e. it didn't

React and Grunt - Envify NODE_ENV='production' and UglifyJS

由 孤人 提交于 2019-12-03 12:51:06
I am using Grunt to build a React project and I want to have 'dev' and 'prod' flavours. As react docs says: To use React in production mode, set the environment variable NODE_ENV to production. A minifier that performs dead-code elimination such as UglifyJS is recommended to completely remove the extra code present in development mode. I am very new using grunt, browserify and stuff but let's see. First problem I have is with envify, I use it as a transform: browserify: { options: { transform: ['reactify'], extensions: ['.jsx'] }, dev:{ options: { watch: true //Uses watchify (faster) }, src: [

How to include node_modules in a separate browserify vendor bundle

由 ﹥＞﹥吖頭↗ 提交于 2019-12-03 10:48:44
问题 I am trying to convert an AngularJS app to use browserify. I have installed all my bower packages in node_modules using napa. Now I want to browserify them into a separate vendor bundle and declare them as 'external' dependencies. I would like to give them aliases, so that I can "require('angular')" instead of "require('angular/angular')", as it seems you can do with externals. The examples I have seen (e.g. http://benclinkinbeard.com/posts/external-bundles-for-faster-browserify-builds/) all

browserify Error : http.createServer is not a function

由 匿名 (未验证) 提交于 2019-12-03 09:52:54
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I tried to browserify this node js script : var phantom = require('phantom') phantom.create(function(ph) { ph.createPage(function(page) { page.open("editor.html", function(status) { console.log("opened diagram? ", status); page.evaluate(function() { return document.getElementById("GraphImage").src; }, function(result) { //console.log(result); ph.exit(); }); }); }); }); So I used this command: browserify myscript.js > bundle.js and when I run bundle.js from an html file I get this error: http.createServer is not a function it seems that

gulp browserify reactify task is quite slow

由 ε祈祈猫儿з 提交于 2019-12-03 09:45:07
问题 I am using Gulp as my task runner and browserify to bundle my CommonJs modules. I have noticed that running my browserify task is quite slow, it takes around 2 - 3 seconds, and all I have is React and a few very small components I have built for development. Is there a way to speed up the task, or do I have any noticeable problems in my task? gulp.task('browserify', function() { var bundler = browserify({ entries: ['./main.js'], // Only need initial file transform: [reactify], // Convert JSX
订阅 browserify