webpack-工程化工具

一.簡介

1.webpack 是 facebook 公司發佈的一款工程化工具,早期有 react 使用.

2.核心理念: 一切都是資源,是資源咱們就能模塊化打包加載.

3.webpack 默認支持 commonjs 規範 ( 也支持 amd, cmd 規範不建議使用 ) ,因此咱們能夠像開發 node 同樣開發.

4.特色: 模塊化開發, 打包加載.

5.安裝 npm install -g webpack ,  npm install -g webpack-dev-server ( 必需要先安裝 node.js 和 npm )

6.配置文件 ( webpack.config.js) : 必需要有

module.exports = {
    resolve: {
        // 更改引入的模塊文件地址
        alias: {
            vue$: 'vue/dist/vue.js'
        }
    },
    entry: {
        '03' : './es/03.es',
        '04' : './es/04.es',
        '05' : './es/05.es',
        '06' : './es/06.es',
        '07' : './es/07.es',
        '08' : './es/08.es',        
        '09' : './es/09.es',
        '10' : './es/10.es',
        '11' : './es/11.es',
        '12' : './es/12.es',
        '13' : './es/13.es'
    },
    output: {
        filename: './pack/[name].js'
    },
    module: {
        rules: [
            {
                test: /\.es$/,
                loader: 'babel-loader?presets[]=es2015'
            }
        ]
    }
}