Question

我想将我的libs和我的应用程序代码拆分成单独的包，这样我就可以分别为每个插入脚本标签，因为我不希望将jQuery，Backbone和Underscore添加到我的每个应用程序包中。

但是，我尝试了几种方法，每次我从Backbone收到错误时说：

Uncaught TypeError: Cannot read property 'ajax' of undefined

我正在编译一个如下所示的libs.js文件：

global.$ = require('./jquery')
global._ = require('underscore')
global.Backbone = require('backbone')

我不得不手动下载jQuery并将其填入我的/ src / vendor文件夹，因为nom install jquery因某种原因失败了。

我还有一些简单的测试应用程序代码，可以编译成app.js：

// User.js
var Backbone = require('backbone')
module.exports = User = Backbone.Model.extend({
  url : '/user'
});

// app.js
var User = require('./user');
var u = new User()

u.on('change', function(e){
  $('h1').append('Updated!')
});

u.fetch()

在我的HTML中，libs.js的脚本标记先于app.js。

也许我从一开始就以一种奇怪的方式接近这整个事情，因为当以这种方式使用这些lib时，googling的方式似乎没什么用处，所以任何输入都是非常感谢！

Answer 1

我在Browserify中阅读了更多有关外部化，别名和填充的内容。我终于能够将Coffeescript gruntfile配置放在一起工作：

browserify:
  libs:
    src: ['src/vendor/jquery.js', 'underscore', 'backbone'],
    dest: 'public/js/libs.min.js'
    options:
      alias: ['backbone:', 'underscore:']
      shim:
        jQuery:
          path: 'src/vendor/jquery'
          exports: '$'
  home:
    src: ['src/js/main-home.js']
    dest: 'public/js/main-home.min.js'
    options:
      external: ['backbone', 'underscore']

在main-home.js中，我现在能够var Backbone = require('backbone')然后Backbone.$ = $，一切正常。

Answer 2

似乎没有正确加载jQuery，该错误可能是因为您尝试调用$.ajax但$未定义。

也许另一个原因可能是因为您尝试在jQuery之前加载Backbone。请尝试以Backbone之前的jQuery代替＃{1}}。

Browserify单独的libs.js和app.js导致Backbone找不到jQuery

2 个答案: