将 Browserify 与 JQuery 一起使用 - 'really' 是什么意思?
Using Browserify with JQuery - what does it 'really' mean?
javascript 的新手,等等。我想做一个纯粹的 HTML/Javascript 项目。我查看了 requireJS,从我读到的内容来看,在我看来,一些项目经历了将他们的 requireJS 项目切换到 node/browserify 个项目的痛苦。
所以我想我只是从一个 node/browserify 项目开始。
我有限的理解是,当您浏览一个项目时,它基本上将依赖项与您的 javascript 一起打包。
几个问题
它只创建一个文件吗?
如果它创建多个文件,那么如果多个文件依赖同一个项目会怎样
(例如lodash)?它是否附加了所需的源代码
项目多次?
如果我使用浏览器端库怎么办
作为 JQuery...在这种情况下,根据 docs,似乎我
将需要使用 jsdom。当我浏览这个时会发生什么?是
它比仅使用 jquery?
更昂贵
Node.js 和 jQuery:
Node.js 和浏览器之间的一个重要区别是 Node.js 是 just a:
platform built on Chrome's JavaScript runtime
它只是意味着它允许您执行 javascript 代码。浏览器也有自己的 JS 运行time 在客户端执行脚本 和 另外提供一个平均值 "for representing and interacting with objects in HTML, XHTML, and XML documents." 就是 Document对象模型 (DOM).
在Node.js中没有HTML文件,你只需要处理JS代码,因此在Node.js中使用jQuery没有任何意义, since jQuery:
makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers.
Node.js 和 browserify:
Node.js 提供了一个 module loading system 允许您使用 require
关键字包含其他模块。所以任何包含 require
代码的 JS 代码都不能在浏览器中执行,因为直到 ECMA5 都没有内置的模块加载机制。
Browserify 简单地模拟 require
关键字并允许您在浏览器中使用它,如 here:
所解释的
Browserify uses the term entry file(s) to describe where it will start reading a dependency graph, and its output is referred to as a bundle.
Node.js 适合你的项目?:
由于您的项目旨在 运行 在浏览器中(而不是在服务器上),因此无需迁移到 Node.js。 但是,您可以使用 Nodejs 来更好地维护您的项目:
- 在开发中将项目分离为模块,并使用 browserify 创建单个捆绑文件以用于生产。
- 使用多个预处理器,并编译(例如coffeeScript, Less等)
- 测试您的模块(例如 mocha, jest)
- 使用构建系统(例如gulp)
- 等...
在你测试了你的模块(并编译了你的 coffeescript!)之后,你只需让 browserify 创建你的 main.bundle.js
并在你的产品中像这样导入它:
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="main.bundle.js"></script>
javascript 的新手,等等。我想做一个纯粹的 HTML/Javascript 项目。我查看了 requireJS,从我读到的内容来看,在我看来,一些项目经历了将他们的 requireJS 项目切换到 node/browserify 个项目的痛苦。
所以我想我只是从一个 node/browserify 项目开始。
我有限的理解是,当您浏览一个项目时,它基本上将依赖项与您的 javascript 一起打包。
几个问题
它只创建一个文件吗?
如果它创建多个文件,那么如果多个文件依赖同一个项目会怎样 (例如lodash)?它是否附加了所需的源代码 项目多次?
如果我使用浏览器端库怎么办 作为 JQuery...在这种情况下,根据 docs,似乎我 将需要使用 jsdom。当我浏览这个时会发生什么?是 它比仅使用 jquery?
更昂贵
Node.js 和 jQuery:
Node.js 和浏览器之间的一个重要区别是 Node.js 是 just a:
platform built on Chrome's JavaScript runtime
它只是意味着它允许您执行 javascript 代码。浏览器也有自己的 JS 运行time 在客户端执行脚本 和 另外提供一个平均值 "for representing and interacting with objects in HTML, XHTML, and XML documents." 就是 Document对象模型 (DOM).
在Node.js中没有HTML文件,你只需要处理JS代码,因此在Node.js中使用jQuery没有任何意义, since jQuery:
makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers.
Node.js 和 browserify:
Node.js 提供了一个 module loading system 允许您使用 require
关键字包含其他模块。所以任何包含 require
代码的 JS 代码都不能在浏览器中执行,因为直到 ECMA5 都没有内置的模块加载机制。
Browserify 简单地模拟 require
关键字并允许您在浏览器中使用它,如 here:
Browserify uses the term entry file(s) to describe where it will start reading a dependency graph, and its output is referred to as a bundle.
Node.js 适合你的项目?:
由于您的项目旨在 运行 在浏览器中(而不是在服务器上),因此无需迁移到 Node.js。 但是,您可以使用 Nodejs 来更好地维护您的项目:
- 在开发中将项目分离为模块,并使用 browserify 创建单个捆绑文件以用于生产。
- 使用多个预处理器,并编译(例如coffeeScript, Less等)
- 测试您的模块(例如 mocha, jest)
- 使用构建系统(例如gulp)
- 等...
在你测试了你的模块(并编译了你的 coffeescript!)之后,你只需让 browserify 创建你的 main.bundle.js
并在你的产品中像这样导入它:
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="main.bundle.js"></script>