菜鸟入坑记-Vue从零开始(0)

Vue是 一套用于构建用户界面的渐进式框架，也是目前主流的前端框架之一。容易上手，也支持与多种类库组合使用。

一、Vue的安装使用

Vue的安装可以分为两大类：

1. 引入JS文件：直接下载vue.min.js文件,再用<script>引入；或者使用CDN方法，用<script>标签直接引入网络文件（例：https://cdn.staticfile.org/vue/2.2.2/vue.min.js）；

2.使用包管理工具：如npm、yarn等。当然使用这些之前，还需要安装nodejs环境，npm是node默认的包管理工具，yarn则需要单独安装。在装好之后，使用 npm install --global vue-cli 或者 yarn global add vue-cli 安装。

二、创建Vue项目

1.对引入js文件的方式，直接使用即可，如下：

<div id="myapp">
		  <p>{{ message }}</p>
</div>
<script>
		new Vue({
		  el: '#myapp',
		  data: {
		    message: 'Hello Vue.js!'
		  }
		})
</script>

2.使用npm 创建时，

执行 vue init webpack myapp ，在创建过程中，会有一些选择，一般直接允许或者通过即可。

To get started:
   
     cd my-project
     npm install
     npm run dev
   
   Documentation can be found at https://vuejs-templates.github.io/webpack    

出现这些提示时，创建完成。然后按照命令，

cd my-project 进入创建好的项目

npm install 安装项目依赖

npm run dev 启动项目。

访问 http://localhost:8080， 可以看到启动页面。

一般来说，构建大型单页面应用时，推荐使用npm搭建项目。