webpack 打包

 

 

 

 

 

 

// 导入处理路径的模块
let path = require('path');

// 导出一个配置对象，将来webpack在启动的时候，会默认来查找webpack.config.js，并读取这个文件中导出的配置对象，来进行打包处理
// 单进单出
// 暴露一个模块
module.exports = {

    // 入口  打包谁
    //  __dirname当前模块目录名
    entry: path.resolve(__dirname, 'src/index.js'),

    // 出口  打包到哪
    output: { // 配置输出选项
        path: path.resolve(__dirname, 'dist'), // 配置输出的路径
        filename: 'bundle.js' // 配置输出的文件名 起什么都可以
    },

}
// 多进多出
module.exports = {

    // 入口  打包谁
    //  __dirname当前模块目录名
    entry: {
        a: path.resolve(__dirname, 'src/index1.js'),
        b: path.resolve(__dirname, 'src/index2.js'),

    },
    // 出口  打包到哪
    output: { // 配置输出选项
        path: path.resolve(__dirname, 'dist'), // 配置输出的路径
        filename: '[name].bundle.js' // 配置输出的文件名 起什么都可以
    },

}

// 多进 单出
module.exports = {

    // 入口  打包谁
    //  __dirname当前模块目录名
    entry: [
        path.resolve(__dirname, 'src/index1.js'),
        path.resolve(__dirname, 'src/index2.js'),

    ],
    // 出口  打包到哪
    output: { // 配置输出选项
        path: path.resolve(__dirname, 'dist'), // 配置输出的路径
        filename: '[name].bundle.js' // 配置输出的文件名 起什么都可以
    },

}

 
// 区别   1，导入不一样 2，规范不一样
// require 复制了一个模块，common.js的规范（nodejs的规范）
// import  引用一个模块，原始模块会发生更改，es的规范