Vue系列（七）—— 从零开始搭建基于Webpack的Vue项目
Hello小伙伴们，Vue也写了好几篇了，今天说点更实用的，今天我们就要来聊聊怎样能够快速搭建一个Vue的程序呢？这里我们可以基于Webpack去搭建，下面我们就来详细介绍一下～
1安装
首先，要为大家隆重介绍一下npm的淘宝镜像：这绝对是个神器，拥有了它，大家就会发现install的时候那是犹如神助啊，刷刷滴呀～
淘宝镜像 cnpm：https://npm.taobao.org/：下载淘宝镜像压缩包
$ npm install -g cnpm --registry=https://registry.npm.taobao.org
$cnpm install --global vue-cli
$vue init webpack my-project(项目名称)
安装依赖：$cd my-project
$npm install
$npm run dev
这个时候我们就搭建起来一个可以运行的系统啦～那么我们再回忆一下之前的知识点吧，看看怎么用进来～
2数据驱动
<div id="app">
hello {{name}} // 4.渲染
</div>
<script>
let vm = new Vue({ //创建一个实例 1.创建实例语法
el:"#app", //3. 挂载元素
data:{
name:"Rabbit" //2.设置数据
}
});
</script>
3双向绑定
<div id="app">
<input v-model="number">
<p>Number:{{number}}</p>
</div>
<script>
let vm=new Vue({
el:"#app",
data:{
- number:"",
}
}),
</script>
4组件化
<div id="app">
<card></card>
<card></card>
<card></card>
</div>
<script>
//注册一个名叫card的组件，放在component文件夹中
Vue.component('card',{
template:`<div>
<img src="logo.png" alt="">
<h2>web</h2>
<p>describe</p>
<button>button</button>
</div>`
});
好啦，通过这些步骤就可以轻松搭建一个基于Webpack的Vue程序啦，是不是很简单呢～～喜欢兔妞的文章就请关注+在看吧～～