我是Browserify的新手,我正在尝试弄清楚如何在客户端需要下载多少方面提高效率。我有一个网络应用程序,它使用许多不同的第3方库和自定义代码。对于Browserify,人们建议的一般方法似乎是将所有内容打包到一个大的bundle.js中。由于以下几个原因,这对我来说似乎非常低效:例如,假设您的bundle.js包含lib1、lib2、lib3、customLib。如果您的Web应用程序的一部分只需要lib1,客户端仍然需要下载一个巨大的bundle.js,并且它最终没有使用其中的75%。浪费字节下载。不必要地增加了页面加载时间。如果您的customLib是您经常迭代的一段代码,那么
我的gulpfile.js中有以下设置:gulp.task('browserify',function(){browserify(config.paths.browserifyEntry).transform(reactify).bundle().pipe(source('master.js')).pipe(gulp.dest(config.paths.dist))//.pipe(connect.reload());});gulp.task('watch',function(){gulp.watch(config.paths.components,['browserify']);gul
我有一个test.js脚本,它定义了一个类App并从HTML文件加载,一切正常。当我使用browserify或webpack从test.js创建一个testBundle.js包时,testBundle中的类App.js似乎不再定义。我应该如何编写代码或者我应该给browserify什么选项来定义应用程序并像以前一样从HTML中使用它,但是从包中?。我在打包后得到的错误是:UncaughtReferenceError:Appisnotdefinedhtml文件如下:varapp=newApp();测试.js:'usestrict';classApp{constructor(){conso
当我有一个看起来像这样的x.js文件时:x.jsmodule.exports=function(n){returnn*111}然后我像这样从命令行运行browserify:browserify-r./x.js>bundle.js我得到一个看起来像这样的输出文件(大致):require=(functione(t,n,r){function......./App.jsx":[function(require,module,exports){module.exports=require('0+DPR/');},{}]},{},[])然后在我的浏览器代码中我可以这样做:Reactserverr
我正在尝试在visualstudio中设置TypeScriptHTML应用程序。我想使用reactjsv0.14.7我想避免使用像Browserify这样的工具。但是,如何使用react-dom模块呢?让我们暂时忘掉typescript。我需要先启动并运行纯ES5。目前,我有这个:varButton=React.createClass({render:function(){return(React.createElement("div",{className:"btnbtn-default"},'helloworld'));}});ReactDOM.render(React.creat
我有很多同事和friend都在处理现有的乱七八糟的javascript应用程序,他们想开始过渡到某种js模块系统。我过去曾尝试通过向他们展示如何重构为requirejs来帮助他们,但我开始认为这是一种糟糕的方法。问题通常是他们的全局代码的性质与AMD的异步性质相冲突,尽管我相信AMD的方法,但他们比我关于“正确”的方式来进行模块加载。同时Browserify消除了异步考虑并且更直接但增加了整个构建步骤。对于不使用捆绑或任何类型的构建过程(或仅使用VisualStudio中的默认构建过程)的人来说,这又是一个太大的开销。所以我真正想要的是一个简单的模块系统,允许人们define和requ
Nodebrowserify在构建模块化js应用程序时非常棒。如果gulp也是设置的一部分,工作流isfurtherenhanced管理和解决依赖关系,适本地捆绑,使用sourcemaps进行uglify,auto-polyfill,jshint,测试...这对于css以及预处理,自动前缀,linting,嵌入非常方便资源和生成文档。TL;DR:通过npm/bower,您可以访问广泛的前端库生态系统,使nodejs非常适合构建(不一定是服务!)客户端代码。事实上,将它用于客户端代码非常棒,npm、bower和grunt/gulp将在VS2015中开箱即用。与此同时,我们设置了一个gul
我们有一个项目利用导入,并要求通过NPM包含各种第三方包。其中一些包是用es6编写的,我们需要将它们转换为es5/es2015以便在IE11等浏览器中工作,因为一些包使用=>函数的箭头语法.我们自己的代码使用箭头语法,但它正在通过browserify转换为更普遍支持的语法。问题是我们导入的包,例如camelcase-keys,不会被转译并包含在它们的原始格式中。这对于像Chrome和Edge这样的浏览器来说很好,但对于IE来说它会中断,因为不支持该语法。这是我们当前的package.json和gulpfile.js。如果您需要任何进一步的信息,请告诉我。包.json{"name":"a
我有一些JavaScript代码从任意编译为JS的语言编译为commonJS模块,我想使用源映射调试浏览器化代码。所以我的文件已经有一个//#sourceMappingURL=index.js.map,我希望browserify读取它并转换它们,这样我就可以用我原来的非JS语言进行调试。我需要为此进行另一个转换吗?我尝试使用browserify的调试标志,然后它确实生成了一个源映射,但它是针对中间JS文件的,而不是原始的非JS文件。我什至看到原始的//#sourceMappingURL语句在包中挥之不去,我的浏览器调试器完全不喜欢它。这可能吗?我看到这个:Keeporiginaltyp
有没有人尝试通过browserify使用代码镜像?我发现没有任何东西是可见的,即使它已经生成了所有的html标签。代码:varCodeMirror=require('codemirror');require('codemirror/mode/javascript/javascript.js');vareditor=CodeMirror.fromTextArea(document.getElementById("code"),{lineNumbers:true,extraKeys:{"Ctrl-Space":"autocomplete"},mode:{name:"javascript",