环境搭建
-
安装node
-
淘宝镜像安装npm包:
npm install -g cnpm --registry=https://registry.npm.taobao.org要使用sudo -g是全局安装的意思
-
全局使用vue-cli脚手架: cnpm install --global vue-cli
-
验证是否成功:输入vue,弹出相关信息
-
创建新项目:vue init webpack 项目名
index.html、App.vue、main.js的区别
新建的vue项目中,index.html文件在项目目录下,main.js和App.vue在项目目录的src目录下
- 在项目路径下运行npm run dev命令后,可以在网页中查看运行页面
- index.html 是默认的主渲染页面文件
修改index.html的title,在body中增加一个div,刷新一下页面,可以看到页面标题和内容都发生了变化 - src/main.js是入口文件,主要作用是初始化vue实例并使用需要的插件
在main.js文件中定义了一个vue对象,其中el为实例提供挂载元素