成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

requirejs之局部require函數(shù)踩坑

gityuan / 1117人閱讀

摘要：問題就出在這個方法上，它將整個回調(diào)函數(shù)轉(zhuǎn)成了，然后在中通過字符串來尋找依賴。其實，在執(zhí)行前會執(zhí)行另一個方法，參考文章得知，首先會執(zhí)行來判斷回調(diào)函數(shù)中有幾個參數(shù)，個參數(shù)時就認(rèn)為傳入了，個參數(shù)時就認(rèn)為傳入了和，個參數(shù)時認(rèn)為傳入了，和。

最近用gulp壓縮了一下requirejs項目中的文件，出現(xiàn)了讓人很糾結(jié)的錯誤，原代碼

define(funciton(require){
    var $ require = $("jquery");
});

壓縮后：

define(function(n){var $ = n("jquery")});
報錯：Uncaught Error: Module name "jquery" has not been loaded yet for context

可以看到壓縮前后唯一的區(qū)別就是，函數(shù)名require被替換了更精簡的n。講道理require作為一個形參，叫啥名字應(yīng)該都沒關(guān)系的，可偏偏就出了錯。
更神奇的是只要將函數(shù)內(nèi)部的n改成require就不報錯了：

define(function(n){var $ = require("jquery")});

蛋疼，明明傳進(jìn)來的是n，哪來的require啊。
雖然局部require只是requirejs的一個語法糖，但沒道理壓縮后就會報錯啊。一番搜索后終于找到原因。
根據(jù)官網(wǎng)文檔局部require最終會被轉(zhuǎn)化為define([])形式，但是轉(zhuǎn)化的方法比較特殊，是通過Function.prototype.toString()來獲取依賴值的。問題就出在這個Function.prototype.toString()方法上，它將整個回調(diào)函數(shù)轉(zhuǎn)成了string，然后在string中通過"require"字符串來尋找依賴。所以，局部require不能被替換成其它名字，而且require()中不能放變量或者path，因為轉(zhuǎn)成字符串后可識別不出這些。
其實，在執(zhí)行Function.prototype.toString()前會執(zhí)行另一個方法，參考文章得知，首先會執(zhí)行unction.prototype.length來判斷回調(diào)函數(shù)中有幾個參數(shù)，1個參數(shù)時就認(rèn)為傳入了require，2個參數(shù)時就認(rèn)為傳入了require和exports，3個參數(shù)時認(rèn)為傳入了require，exports和module。這也是為什么

define(function(n){var $ = require("jquery")});

能夠正常運(yùn)行的原因。
官網(wǎng)推薦的解決辦法是全改成常規(guī)的define([])來定義依賴。
我目前的做法是配置gulp不壓縮name:

var uglify = require("gulp-uglify");
gulp.task("default",function(){
    gulp.src(path).pipe(uglify({mangle:false}));
});

希望此文章對大家有所幫助。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/86875.html

相關(guān)文章

  • 前端模塊化開發(fā)

    摘要：來源于阿賢博客模塊化今天給大家寫一篇關(guān)于前端模塊化開發(fā)知識點(diǎn)。前端模塊化開發(fā)那點(diǎn)歷史模塊化是指在解決某個復(fù)雜混雜問題時，依照一種分類的思維把問題進(jìn)行系統(tǒng)性的分解以之處理。 來源于：阿賢博客 javascript模塊化 今天給大家寫一篇關(guān)于前端模塊化開發(fā)知識點(diǎn)。 前端模塊化開發(fā)那點(diǎn)歷史 模塊化： 是指在解決某個復(fù)雜、混雜問題時，依照一種分類的思維把問題進(jìn)行系統(tǒng)性的分解以之處理。模塊...

    tianhang 評論0 收藏0

  • AMD, CMD, CommonJS和UMD

    摘要：若不存在則模塊標(biāo)識應(yīng)該默認(rèn)定義為在加載器中被請求腳本的標(biāo)識。其中是一個數(shù)組，里面的成員就是要加載的模塊是模塊加載完成之后的回調(diào)函數(shù)。在加載與兩個模塊之后執(zhí)行回調(diào)函數(shù)實現(xiàn)具體過程。在判斷是否支持是否存在，存在則使用方式加載模塊。 我的github(PS:希望star): https://github.com/tonyzheng1... 今天由于項目中引入的echarts的文件太大，req...

    KavenFan 評論0 收藏0

  • Javascript模塊全攬

    摘要：要求模塊編寫必須在真正的代碼之外套上一層規(guī)定的代碼包裝，樣子看起來是這樣的模塊代碼通過傳遞一個簽名為的回調(diào)函數(shù)給函數(shù)，就可以把需要注入的變量和函數(shù)注入到模塊代碼內(nèi)。 之前寫的文章急速Js全棧教程得到了不錯的閱讀量，霸屏掘金頭條3天，點(diǎn)贊過千，閱讀近萬，甚至還有人在評論區(qū)打廣告，可見也是一個小小的生態(tài)了；）?？磥砗蚃S全棧有關(guān)的內(nèi)容，還是有人頗有興趣的。 showImg(https://...

    lily_wang 評論0 收藏0

  • OMD: javascript模塊化開發(fā)兼容CommonJS, AMD, CMD 以及 原生 JS

    摘要：它就是一套兼容方案，目前兼容的有以及原生支持。返回值問題在第一次使用時，。具體是什么意義呢的返回值，其實就是插件提供的對外接口，而實際上，就是一個對象。而在環(huán)境下，只需要將這個返回值賦予即可完成該模塊的接口。 有更新，請到github上看源碼 什么是OMD 在node.js流行起來之前，javascript的開發(fā)方式都是函數(shù)式的順序依賴關(guān)系，直到node火起來。CommonJS其實首先...

    lavor 評論0 收藏0

  • 初學(xué)RequireJS

    摘要：本文以初學(xué)身份對比和來說明前者的優(yōu)點(diǎn)，若使用其它庫，可以眼動將替換為你所用的庫模塊化，實現(xiàn)某一功能的方法獨(dú)立化，使其可以復(fù)用這一高大上的名詞，按我的理解，和插件的功能一樣那為什么需要學(xué)習(xí)呢，是將定義為全局變量，在腳本的任何地方都能調(diào)用中的方 本文以初學(xué)身份對比RequireJS和jQuery來說明前者的優(yōu)點(diǎn)，若使用其它庫，可以眼動將jQuery替換為你所用的js庫； 模塊化，實現(xiàn)某一功...

    cheng10 評論0 收藏0

發(fā)表評論

0條評論

gityuan

男|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<