（一）从一个webpack空项目开始

傻鱼为了更好的理解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

 结果一切顺利，我们生成了构建结果

 那我们是不是该测试一下我们的构建结果呢？我们下面继续对项目进行改造..............................