- vue 把一个组件放在一个
.vue文件中，在这个文件中有三个自定义标签：template、script、style，但是浏览器不能直接识别该组件，因此需要通过 webpack 进行打包编译，官方提供 vue-loader 对 .vue 文件进行处理。 - vue-cli 是 vue.js 的脚手架工具，使用之前需要安装 node 和 npm 包管理工具。
- vue实际开发使用
.vue的单文件系统来实现，但是还需要哦诶只很多东西，因此有了 vue-cli 来构建一个项目开发必须使用的一些内容，我们称这个工具为：脚手架。
通过npm install vue-cli -g安装好之后，我们可以在命令行使用一个命令：vue -
vue init
init：初始化（创建）基于vue的项目
vue init webpack hello：基于webpack来构建一个名称为hello的vue项目（项目构建一定要联网！联网！联网！）
vue-cli 是一个交互式命令行，通过 vue 命令构建项目会需要我们填写一些项目的信息：
Project Name：要创建的项目名称（该命令会生产一个 package.json 文件，文件中的 name 选项就是这个 ProjectName，默认为当前创建的项目目录名称，也可以自行制定（但是需要符合 package.json 中 name 命名规则，不要出现大写字母，空格，下划线，可以使用 - ）
Project Description：项目简介，也会出现在 package.json 文件中,可选
Author：作者，可选
下一步直接回车
Install vue-router：是否安装 vue 路由组件，做项目的话一定要安装
Use ESLint to lint your code：是否需要使用 ESLint 模块进行代码检测
Setup unit tests with Karma + Mocha?：是否安装测试（单元测试）
Setup e2e tests with Nightwatch?：是否安装端到端的测试 - 项目需要安装的依赖包在 vue-cli 工具中自动生成的 package.json 文件中有说明
dependencies：项目中实际需要使用到的依赖包
devDependencies：项目开发过程中需要使用的一些工具包，不是项目实际线上代码的一部分 - 运行
所需要的安装依赖包安装完成以后，就可以启动项目，
npm run dev：开启一个测试开发环境 - 项目结构
- build目录：构建项目命令所需要使用到的一些脚本文件和配置文件
- config目录：在vue-cli中会自动安装一个小型的express搭建的热重载web服务器，config里面就是关于这个服务器的相关配置
- dist目录：项目编译构建上线后的存放目录
- node_modules目录：项目依赖包存放目录
- src目录：项目源代码存放目录
- static目录：静态资源存放目录
- main.js：vue脚手架为我们自动生成的项目中设置的入口文件，在该入口文件中，做了一些项目初始化的工作
- 引入 Vue
- 引入必要的组件
- 创建Vue实例
在项目开发过程中，我们的大部分任务是在src这个目录下完成的
网友评论