Tag: browserify

使用Browserify和jQuery插件

一些简要的背景：我使用的是browserify和browserify-shim（和gulp来构build）来创build一个web应用程序。 在这个问题之前，我require从npm的jQuery，所以我没有问题。 一旦我开始做一些优化，我意识到包括jQuery在内的捆绑是多么的庞大。 所以，现在我从CDN抓取jQuery，并将其放在bundle.js文件之前。 但我有问题宣布jQuery作为一个全球性的，适当shimming我的jQuery插件在browserify和browserify-shim。 当我运行gulpbuild立，我不断得到相同的错误： [gulp] gulp-notify: [Compile Error] module "jquery" not found from "/Volumes/Chetan/Users/cshenoy/Projects/urbanstems-node/app/plugins/jquery.inview.js" browserify-shim看起来并不像jQuery那样是全球化的。 作为参考，我使用了inview插件 。 这里是我的package.json和相关的部分 "browser": { "inview": "./app/plugins/jquery.inview.js" }, "browserify-shim": { "jquery": "global:jQuery", "inview": { "depends": [ "jquery" ] } } 让我知道我还可以包括哪些内容来帮助诊断错误。

使用Browserify加载polyfill和垫片的正确方法是什么？

我正在build立一个networking应用程序，我越来越知道和喜欢Browserify。 有一件事已经窃听了我。 我正在使用一些ES6function，需要在旧版本的浏览器中进行es6-promise / es6-promise比如es6-promise和object-assign （npm上的包）。 目前我只是将它们加载到每个需要它们的模块中： var assign = require('object-assign'); var Promise = require('es6-promise'); 我知道这绝对不是要走的路。 这很难维护，我想透明地使用ES6的function，而不是通过需求来“依赖”它们。 什么是加载这样的垫片的明确方式？ 我已经看到了互联网上的几个例子，但他们都是不同的。 我可以： 在外部加载它们： var bundle = browserify(); bundle.require('s6-promise'); // or should I use it bundle.add to make sure the code is runned??? 我在这里的问题是，我不知道模块将在浏览器中加载的顺序。 因此，在需要多填充function的呼叫站点，填充可能还没有发生。 这有额外的缺点，后端代码不能从这些polyfills中受益（除非我失去了一些东西）。 使用browserify-shim或类似的东西。 我真的不明白这是如何工作的ES6function。 手动设置polyfilling： Object.assign = require('object-assign');

Browserify“模块未定义”

我是新的浏览器。 我试了下面的代码，并得到Uncaught ReferenceError: module is not defined加载我的网页时Uncaught ReferenceError: module is not defined 。 一切都很简单，所以不知道我在做什么错： chronoOpenList.js： module.exports = function getChronoOpenList() { var xml = new XMLHttpRequest(); xml.open("GET", "api/nextrequestdue/", true); xml.onreadystatechange = function () { if (xml.readyState === 4 && xml.status === 200) { var jsonText = xml.responseText; parseChronoAndBuildElements(jsonText); } } xml.send(null); } main.js： var getChronoOpenList = […]

如何使用browserify捆绑骨干应用程序？

我正在浏览器遇到一些麻烦。 目标 我试图用Backbone构build基本的TodoMVC单页面应用程序，而不是在我的index.html中使用<script>标记，我试图用browserify把它们全部捆绑起来。 这是我迄今为止所做的。 LIB /模型/ todo.js var backbone = require("backbone"); var Todo = module.exports = backbone.Model.extend({ defaults: function() { return { title: "", completed: false, createdAt: Date.now(), }; }, }); LIB /collections/ todo.js var backbone = require("backbone"), LocalStorage = require("backbone.localstorage"); var TodoCollection = module.exports = backbone.Collection.extend({ localStorage: new LocalStorage('todomvc'), }); LIB / app.js var […]

试图捆绑许多js文件时，Browserify无法find模块

这是我第一天做节点，我有一些问题，试图捆绑一些js文件。 MyFolder |– app (folder) | |– Collections (contains: movies.js) | |– Models (contains: movie.js) | |– node_modules |– main.js |– node_modules (folder) |– static (folder) 这是我想要压缩到静态/ bundle.js的js文件的内容 // app/models/movie.js var Backbone = require("backbone"); var Movie = Backbone.Model.extend({ defaults: { title: "default", year: 0, description: "empty", selected: false } }); module.exports = Movie; // app/collections/movies.js […]

使用Browserify编译dynamic需要的模块

我正在使用Browserify将大型Node.js应用程序编译成单个文件（使用选项–bare和–ignore-missing [以避免Express中的lib-cov出现问题]）。 我有一些代码来dynamic加载模块基于目录中的可用内容： var fs = require('fs'), path = require('path'); fs.readdirSync(__dirname).forEach(function (file) { if (file !== 'index.js' && fs.statSync(path.join(__dirname, file)).isFile()) { module.exports[file.substring(0, file.length-3)] = require(path.join(__dirname, file)); } }); 我得到奇怪的错误，在我的应用程序，其中aribtrary文本文件正在从编译的文件加载目录中加载我认为这是因为path不再设置正确，并且因为Browserify将无法require()的正确的文件是这样dynamic加载的。 在制作静态index.js文件的时候，是否有一个首选的方法来dynamic地要求与Browserify兼容的模块目录？

使用npm jQuery和非npm插件的browserify

我正在使用browserify捆绑前端代码。 到目前为止，这是非常棒的，但是我一直在混合npm和非npm包装方面遇到困难。 例如，使用nQuery版本的jQuery与非CJS版本的jQuery插件。 我目前的解决scheme是使用package.json中的browser键指向jQuery的dist，然后使用browserify-shim将其添加为插件的依赖项。 有没有比我目前有更干净的方式来做到这一点？ 编辑：我目前正在尝试使用npm和package.json来pipe理我所有的依赖项，所以我不想在这个项目上使用bower。 叫我疯了：） 的package.json "dependencies": { "jquery": "~2.1.0", "browserify": "latest", "browserify-shim": "^3.5.0", "jquery-waypoints": "git@github.com:imakewebthings/jquery-waypoints.git", "jquery-validation": "git://github.com/jzaefferer/jquery-validation" }, "browser": { "jquery": "./node_modules/jquery/dist/jquery.js", "jquery-waypoints": "./node_modules/jquery-waypoints/waypoints.js", "jquery-validate": "./node_modules/jquery-validation/build/release.js" }, "browserify-shim": { "jquery": "$", "jquery-waypoints": { "depends": [ "jquery" ] }, "jquery-validate": { "depends": [ "jquery" ] } }, "browserify": { "transform": [ "browserify-shim" ] […]

编译一个npm模块到一个文件中，不需要依赖

我试图将uncss npm模块编译成适合ExecJS编译的单个.js文件。 例如，咖啡剧本人有这个 。 目标是为它创build一个简单的ruby包装，类似于ruby-coffee-script 。 我曾经试过的： 遇到了一个build议UglifyJS的答案。 它没有得到。 使用browserify，应该已经完成​​了这个技巧，但是却无法编译lib / uncss.js并显示以下错误消息： Error: ENOENT, open 'tls' while resolving "tls" from file /home/prajjwal/code/uncss/node_modules/request/node_modules/forever-agent/index.js 我想这是因为browserify没有一个适当的垫片呢？ 我还担心browserify将用replace节点模块的垫片。 他们是完全安全的使用？ 我将会把它embedded到gem中。 不要认为browserify是我应该使用的。 有没有另一种方法，我可以从npm模块生成一个独立的.js？ 任何帮助赞赏。

如何检测什么时候运行browserify？

我有一个库，我想在客户端和服务器端使用。 但是，因为request与browserify不兼容，所以在使用browserify进行编译时，我需要使用一个名为browser-request的不同库 if (inNodejsRuntime) { var request = require('request'); } else if (isBrowserifyRuntime) { var request = require('browser-request'); } 当浏览器正在运行的时候，以及在节点内部的时候，我该如何去检测

如何忽略browserify programmatic api中的库

假设在bundler.jsfind以下代码，并且跟踪entry.js会导致var B = require('backbone'); （Backbone是在package.json声明的依赖项）。 var browserify = require('browserify'); var bundle = new browserify(); bundle.add('entry.js'); bundle.bundle({ noParse: ['backbone'] }); 执行这个捆绑器会产生一个包含原始backbone源的stream。 基于browserify的命令行选项，我预计它会跳过所有主干。 通过阅读来源，我预计可能会有以下工作： var browserify = require('browserify'); var bundle = new browserify({ noParse: ['backbone'] }); bundle.add('entry.js'); bundle.bundle(); 虽然backbone资源仍然出现在stream输出。 是否有可能使用–noparse=FILE作为api的这个应用程序中的configuration选项？