傻鱼为了更好的理解VUE源码,决定编写一个简易版VUE,
一切从建立工程开始,我们建立一个webpack工程
然后安装webpack组件 npm install webpack --save-dev
这是一个空项目就搭建好了,我们修改一下项目的结构,如下
src下的index.js作为一个入口文件,可以先随便写点JS逻辑
build文件夹放置我们的构建配置,test.js放了点node指令的测试语句(这个可以忽略),build.js放置了webpack的配置
扫描二维码关注公众号,回复:
11037884 查看本文章
如下:
const path = require('path') module.exports = { mode: 'production', entry: { app: './src/index.js' }, plugins: [], output: { filename: 'wf-sample-vue.js', path: path.resolve(__dirname, '../dist') }, module: { rules: [] }, devServer: { contentBase: './dist', hot: true } }
最后我们在package.json中添加一条指令来构建我们的index.js
结果一切顺利,我们生成了构建结果
那我们是不是该测试一下我们的构建结果呢?我们下面继续对项目进行改造..............................