vue2.0学习笔记

Vue2.0学习笔记

Vue学习第一天–笔记一

这篇博客仅用来记录本人学习vue的过程以及在过程中遇到的疑难问题及解决方法

环境搭建

1.安装node.js，nodeJs官网下载最新版本安装，具体安装和环境配置参考这篇博客
2. 使用npm命令安装淘宝镜像cnpm
3. 使用淘宝镜像cnpm全局安装vue脚手架vue-cli，安装命令：cnpm install -g vue-cli
4. 使用webpack创建vue项目，首先你得安装了webpack,安装命令：cnpm install webpack -g ;创建vue项目命令：vue init webpack 项目名（如果是小白建议先不安装路由（router）等组件，只简单填写项目名称等就可以）
5. 启动vue项目，启动命令：npm run dev
6. 创建好的vue项目结构如下图所示

项目运行详解

1.项目的入口文件为main.js,文件内容如下

import Vue from 'vue'
import App from './App'  //引入主组件，最外层组件
import router from './router' //引入路由

Vue.config.productionTip = false

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router, //路由注册
  components: { App }, //组件注册
  template: '' //显示组件内容
})

2.App组件说明