webpack入门学习-入口

入口:

单入口写法

entry: string|Array\<string>

对象写法

entry: {[entryChunkName: string]: string|Array<string>}

多页面应用程序

const config = {
  entry: {
    pageOne: './src/pageOne/index.js',
    pageTwo: './src/pageTwo/index.js',
    pageThree: './src/pageThree/index.js'
  }
};

---

我其实一开始是很懵逼的,或者说我一开始都不明白webpack到底是干什么,一开始,我觉得对一个项目打包,不应该像是浏览器请求一样,从html开始吗,怎么一来就是js了,然后意识到一个问题,我们并不需要很多个html啊…emmmm
这样的话,模块化的js直接打包压缩,从我们常用的index.js进入打包,这样,里面涉及到的模块化js都会被引入和加载,这样既不会影响我们维护代码,也可以减少请求文件的数量和大小.美滋滋.

---

输出:

const config = {
  output: {
    filename: 'bundle.js',
    path: '/home/proj/public/assets'
  }
};

module.exports = config;

输出就是写个路径和名字,打包完的项目就可以放到对应的地方去了

---

尝试

const path = require('path');
const config = {
    entry:{
        app:"./src/index.js",
        demo:"./src/demo.js"
    },
    output:{
        filename:'[name].js',
        path:path.resolve(__dirname,'bundle')
    }
}
module.exports = config;