vue项目初始化

初始化

安装脚手架

npm install @vue/cli -g

建立项目

vue create my-project

勾选

• babel:将ES6转成ES5
• router:路由
• vuex:状态管理
• css pre-processors:css预处理器
• ESLint:ES6检测代码规范（不推荐）

选择

• 不使用history模式
• 使用sass with node-sass

vscode插件推荐

• vetur
• vue 2 snippets
• vue vscode snippets

chrome插件调试插件

• vue-devtools

目录结构

• package.json：项目的包管理文件，使用npm或者yarn命令局部安装的第三方模块

结尾是--save，这个模块就被记录在dependencies中
结尾是--save--dev，就被记录在DevDependencies中

• public:存放项目的模板文件，里面的index.html是整个项目的单页面
• src:项目的源代码目录，在这个文件里写代码

main.js:入库文件
router.js:路由配置文件
store.js:vuex状态管理配置文件
app.vue:根组件
views:路由组件
compontents:在路由组件引入的其余组件
assets:在vue文件中使用相对路径引入的志愿文件

启动项目

• 查看package.json中的scripts
  dev:vue-cli-service serve
npm run dev