browserify中沒有衝突jQuery

我有一個大規模的傳統項目，我正在研究，我正在用browserify，backbone，marionette構建一些功能。但是，當我將jQuery放入我的browserify設置中時，該版本會覆蓋在browserify腳本加載之前已加載到我的頁面中的不同版本的jQuery。我不希望發生這種情況。我需要保持舊的jQuery引用分開。browserify中沒有衝突jQuery

是否有可能讓我的shimmed jQuery引用對我的browserify代碼完全私有？我想我需要使用jQuery的沒有衝突模式，但是我怎麼在browserfiy的grunt配置設置中做到這一點。

這是我目前在grunt中的browserify設置。

 vendor: { 
      src: ['www/libs/*.js'], 
      dest: 'www/javascript/built/vendor.js', 
      options: { 
       shim: { 
        jquery: { 
         path: 'www/bower_components/jquery/jquery.js', 
         exports: 'jQuery' 
        }, 
        underscore: { 
         path: 'www/bower_components/underscore/underscore.js', 
         exports: '_' 
        }, 
        backbone: { 
         path: 'www/bower_components/backbone/backbone.js', 
         exports: 'Backbone', 
         depends: { 
          underscore: 'underscore' 
         } 
        }, 
        'backbone.marionette': { 
         path: 'www/bower_components/backbone.marionette/lib/backbone.marionette.js', 
         exports: 'Marionette', 
         depends: { 
          jquery: '$', 
          backbone: 'Backbone', 
          underscore: '_' 
         } 
        } 
       } 
      } 
     },

感謝

來源

2014-10-30 Cameron Strandberg

我解決了這個問題，而無需使用的哼聲和涼亭，但我認爲它可能會轉化。

這需要安裝browserify-shim，儘管可能有一種方法可以直接配置browserify來執行此操作，因爲它具有墊片的配置選項。

這裏是我的package.json：

// aliases for browserify 
"browser": { 
    "jquery": "./js/vendor/browserify-hax.js", 
    // a pre-built jquery 
    "static-jquery": "./js/vendor/jquery.js" 
}, 
// tell browserify to use browserify-shim 
"browserify": { 
    "transform": [ 
    "browserify-shim" 
    ] 
}, 
// Tell browserify shim how to generate module.exports 
"browserify-shim": { 
    "static-jquery": { 
    "exports": "$" 
    } 
}

在JS /供應商/ browserify-hax.js：

"use strict"; 
var jQuery = require('static-jquery'); 
var nonGlobal = jQuery.noConflict(true); 
module.exports = nonGlobal;

在我的應用程序的代碼，我可以用require('jquery')，我會得到一個jQuery從與現有全局版本不衝突的捆綁中獲得。它應該是安全的，因爲直到它被編輯爲require之前，被限制的模塊才被實際定義。無論如何，使用jQuery().jquery來檢查庫的版本是否像你期望的那樣是值得的。

對我來說，這感覺像一個非常混亂的解決方案，但它是唯一的方法，我可以找到捆綁jQuery時，當你已經有另一個全球。我很想知道你是否能想出更好的解決方案。

我也嘗試過直接從npm使用jQuery，但我無法在browserify包中正確編譯它，儘管它在node.js中直接使用require時工作正常。我堅持使用git構建的預構建jquery。

來源

2014-12-01 14:02:52 bnkr

browserify中沒有衝突jQuery

回答

相關問題