webpack學習筆記

一、webpack是流行的資源打包工具，屬於前端workflow（工做流）的一部分。

簡單說，它牛逼的地方就是把一切靜態資源打包在一個文件，而且有一堆的插件。

二、安裝webpack

把webpack安裝到項目依賴
npm install webpack --save-dev 安裝到項目。

三、webpack要工做，依賴於一個webpack.config.js的配置文件。

module.exports={        //node.js的模塊輸出標準格式
    entry: './main.js',     //entry是入口文件,是程序的入口文件的相對地址
    output: {               //打包後輸出的文件
        filename: 'bundle.js'       //輸出的文件叫作bundle.js
    }
};

四、命令行執行webpack

調用全局安裝的webpack工具對資源進行打包，最後輸出或建立bundle.js文件

五、index.html script src = bundle.js

網頁最後調用的是打包後的文件

六、入口文件的數量有多個

//node.js的模塊輸出標準格式
module.exports = {
    //entry是入口文件,是程序的入口文件的相對地址
    entry: {
        bundle1: './main1.js',
        bundle2: './main2.js'
    },
    //打包後輸出的文件
    output: {
        filename: '[name].js'
    }
    //輸出的文件叫作bundle.js
};