簡(jiǎn)介

成都創(chuàng)新互聯(lián)公司是一家集網(wǎng)站建設(shè),鎮(zhèn)原企業(yè)網(wǎng)站建設(shè),鎮(zhèn)原品牌網(wǎng)站建設(shè),網(wǎng)站定制,鎮(zhèn)原網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營(yíng)銷,網(wǎng)絡(luò)優(yōu)化,鎮(zhèn)原網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè),幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競(jìng)爭(zhēng)力。可充分滿足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專業(yè)、時(shí)尚、前沿,時(shí)刻以成就客戶成長(zhǎng)自我,堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己,讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。
require-ensure和require-amd的區(qū)別:
require-amd
說(shuō)明: 同AMD規(guī)范的require函數(shù),使用時(shí)傳遞一個(gè)模塊數(shù)組和回調(diào)函數(shù),模塊都被下載下來(lái)且都被執(zhí)行后才執(zhí)行回調(diào)函數(shù)
語(yǔ)法: require(dependencies: String[], [callback: function(...)])
參數(shù)
require-ensure
說(shuō)明: require.ensure在需要的時(shí)候才下載依賴的模塊,當(dāng)參數(shù)指定的模塊都下載下來(lái)了(下載下來(lái)的模塊還沒(méi)執(zhí)行),便執(zhí)行
參數(shù)指定的回調(diào)函數(shù)。require.ensure會(huì)創(chuàng)建一個(gè)chunk,且可以指定該chunk的名稱,如果這個(gè)chunk名已經(jīng)存在了,則將本次依賴的模塊合并到已經(jīng)存在的chunk中,最后這個(gè)chunk在webpack構(gòu)建的時(shí)候會(huì)單獨(dú)生成一個(gè)文件。
語(yǔ)法: require.ensure(dependencies: String[], callback: function([require]), [chunkName: String])
注意點(diǎn):requi.ensure的模塊只會(huì)被下載下來(lái),不會(huì)被執(zhí)行,只有在回調(diào)函數(shù)使用require(模塊名)后,這個(gè)模塊才會(huì)被執(zhí)行。
示例
require-amd
源代碼
webpack.config.amd.js
var path = require("path");
module.exports = {
entry: "./example.amd.js",
output: {
path: path.join(__dirname, "amd"),
filename: "[name].bundle.js",
chunkFilename: "[id].chunk.js"
}
};
example.amd.js
require(["./module1"], function(module1) {
console.log("aaa");
var module2 = require("./module2");
console.log("bbb");
});module1.js
console.log("module1");
module.exports = 1;module2.js
console.log("module2");
module.exports = 2; 構(gòu)建結(jié)果
命令行中運(yùn)行webpack --config webpack.config.amd.js
- main.bundle.js
- example.amd.js
- 1.chunk.js
- module1.js
- module2.js
運(yùn)行結(jié)果
瀏覽器中運(yùn)行amd/index.html,控制臺(tái)輸出:
module1 aaa module2 bbb
require-ensure
源代碼
webpack.config.ensure.js
var path = require("path");
module.exports = {
entry: "./example.ensure.js",
output: {
path: path.join(__dirname, "ensure"),
filename: "[name].bundle.js",
chunkFilename: "[name].chunk.js"
}
};
example.ensure.js
require.ensure(["./module1"], function(require) {
console.log("aaa");
var module2 = require("./module2");
console.log("bbb");
require("./module1");
}, 'test');module1.js
同上
module2.js
同上
構(gòu)建結(jié)果
命令行中運(yùn)行webpack --config webpack.config.ensure.js
- main.bundle.js
- example.amd.js
- 1.chunk.js
- module1.js
- module2.js
運(yùn)行結(jié)果
瀏覽器中運(yùn)行ensure/index.html,控制臺(tái)輸出:
aaa
module2
bbb
module1
require-ensure-chunk
源代碼
webpack.config.ensure.chunk.js
var path = require("path");
module.exports = {
entry: "./example.ensur.chunk.js",
output: {
path: path.join(__dirname, "ensure-chunk"),
filename: "[name].bundle.js",
chunkFilename: "[name].chunk.js"
}
};
example.ensur.chunk.js
require.ensure(["./module1"], function(require) {
console.log("aaa");
require("./module1");
console.log("bbb");
}, 'common');
require.ensure(["./module2"], function(require) {
console.log("ccc");
require("./module2");
console.log("ddd");
}, 'common');
module1.js
同上
module2.js
同上
構(gòu)建結(jié)果
命令行中運(yùn)行webpack --config webpack.config.ensure.js
- main.bundle.js
- example.amd.js
- 1.chunk.js
- module1.js
- module2.js
運(yùn)行結(jié)果
瀏覽器中運(yùn)行ensure/index.html,控制臺(tái)輸出:
aaa
module1
bbb
ccc
1module2
ddd
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持創(chuàng)新互聯(lián)。
當(dāng)前名稱:詳解webpackrequire.ensure與requireAMD的區(qū)別
文章URL:http://www.yijiale78.com/article30/joogpo.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供品牌網(wǎng)站制作、企業(yè)建站、微信公眾號(hào)、建站公司、網(wǎng)站排名、自適應(yīng)網(wǎng)站
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)