我们有使用require的框架.js 我们正在加载如下包
define(["converter/service/utils"], function (utils) {
现在我们能够使用实用程序文件。
现在我们有一个新的js文件,它是浏览器化和丑陋的
browserify main.js | uglifyjs > bundle.js
我已经将 boundle.js 文件添加到我的项目(在服务文件夹下(,我想加载它,但它不起作用......
我尝试像下面这样加载它:
define(["converter/service/bundle"], function (bundle) {
但是捆绑包是空的(在调试它时...
知道如何使用 require.js 加载浏览器fiy 文件吗?
我知道在 broswerify 的文档中,我们应该像这样添加它
<script src="bundle.js"></script>
但是我们使用require.js来加载模块,并且我能够使用其他js文件执行此操作... 例如,如果我将此文件保存在我的项目中
https://rawgit.com/hugeen/lebab-experiment/master/lebab.js
我可以加载它.js...
编辑:
我所做的是npm init
和
npm install lebab --save
创建文件main.js
并放置以下代码
var lebab = require("lebab");
并运行命令
browserify --standalone someName main.js | uglifyjs > bundle.js
它成功完成
将bundle.js
文件放在converter/service
文件夹下
并尝试像下面这样要求它:
define(["converter/service/bundle"], function (bundle) {
或者也
define(["converter/service/someName"], function (bundle) {
而且它不起作用...我在这里错过了什么?
编辑2
由于我们使用我们的工具(包装需要.js(,因此很难跟踪正确的错误,我使用一些工具(require.js(来验证它 使用Webstoram VSCODE进行一些项目调整。我只想验证捆绑包是否正确创建...
您的捆绑包不包含允许 RequireJS 加载它的必要代码,因为默认情况下browserify
不包含所需的代码。获得所需结果的一种方法是使用--standalone
告诉 Browserify 在您的捆绑包周围放置一个 UMD 包装器:
browserify --standalone someName main.js | uglifyjs > bundle.js
someName
是 UMD 包装器在检测到它未在 CommonJS 或 AMD 环境中运行时将使用的名称。在这种情况下,它会将您的捆绑包导出为全局空间中someName
符号。您必须决定要在那里使用什么名称。
使用 UMD 包装器后,您的捆绑包将检测到它在 AMD 环境中运行(因为 RequireJS 使define
可用(,并将调用define
将自身注册到 RequireJS 作为模块。