模塊加載順序在requirejs

我們遇到了在現有的項目一個有趣的問題，模塊加載順序在requirejs

我們使用requireJS
我們所有的模塊都符合AMD（我們有很多他們）
我們需要將babel-polyfill的子集作爲AMD模塊加入到該項目中。
這不是可以手動一個一個
我們的代碼進行了優化，捆綁使用r.js

我們的主文件看起來是這樣的這種依賴關係添加到所有模塊：// main.js

require(
[ 
    'router', 
    'someOtherModule', /* In reality we have quite a few more here */ 
], function(Router, AppModule) {/*... app code ...*/} 
)

所以我們想在加載任何其他模塊之前加載這個polyfill模塊main.js

什麼將不起作用：

Shim-Shim用於非AMD模塊。
將polyfill添加到上面的列表router - 在r.js吐出的縮小代碼中，不能保證polyfill實際上在router之前的代碼中，它不是定義的行爲，因此不能計算在內。
與另一require['polyfill']呼叫包裝紙似乎一切都搞砸了r.js優化，它似乎不會捆綁在一起的其他模塊，如果他們包裹在require[]。
由於polyfill是AMD模塊，我們不能只將其包含在<HEAD>

選項3仍然是我們正在調查，看它是否是可能的事情。

所以，問題是 - 我們正在試圖做的可能是什麼？

來源

2017-07-31 Patrick

每當我加載polyfills我永遠永遠永遠加載他們在script元素head。我從來沒有通過RequireJS加載它們。正如您發現的，通過RequireJS加載它們會引發各種問題。你寫道：

由於polyfill是一個AMD模塊，我們不能將它包含在<HEAD>中。

的babel-polyfill包builds itself成可以通過script元素使用Browserify加載腳本：

#!/bin/sh 
set -ex 

BROWSERIFY_CMD="../../node_modules/browserify/bin/cmd.js" 
UGLIFY_CMD="../../node_modules/uglify-js/bin/uglifyjs" 

mkdir -p dist 

node $BROWSERIFY_CMD lib/index.js \ 
    --insert-global-vars 'global' \ 
    --plugin bundle-collapser/plugin \ 
    --plugin derequire/plugin \ 
    >dist/polyfill.js 
node $UGLIFY_CMD dist/polyfill.js \ 
    --compress keep_fnames,keep_fargs,warnings=false \ 
    --mangle keep_fnames \ 
    >dist/polyfill.min.js

如果檢查dist/polyfill.js，你會看到它是不是AMD模塊。（它所稱的define函數不是AMD的define函數。）

您應該能夠將此方法適用於您使用的任何子集babel-polyfill。

來源

2017-07-31 16:15:26 Louis

模塊加載順序在requirejs

回答

相關問題