个人自学前端34-Vue11-Vue脚手架

目录

• 一. 为什么要脚手架
• 二. 单文件组件.vue
• 三. vue脚手架路径写法
• 四. use

一. 为什么要脚手架

为什么要脚手架 => 为了实现模块化项目
模块化项目 => 提高开发效率,减少维护成本

模块化 => 把本来写在一起的代码分成很多个文件来写.每个文件是一个模块.
模块化带来的新问题 => 模块化之间需要导入和导出.

导入:import 变量名 from 某个文件地址
导出:export default 导出的东西

二. 单文件组件.vue

vue脚手架 => 专门有一个种专门用来写组件的文件后缀 => .vue
.vue => 单文件组件

.vue单文件组件有3个组成部分

1. template (组件的视图)
2. script (组件的数据和逻辑)
   在这里需要导出组件选项.这个组件选项内,不用写template
3. style (组件的样式)

三. vue脚手架路径写法

1. 源文件路径.(源文件都放在node_modules) => 直接写源文件名字
2. 当前文件夹. => ./
3. 上一级. => ../
4. @ => src文件夹(绝对路径)
5. index.js可以直接省略
6. .js和.vue和.json文件的后缀可以省略

四. use

脚手架中,Vue的插件导入后,都需要使用use处理一次.
不是vue的插件不需要使用use,比如axios.
VueRouter和Vuex都是Vue的插件.

    Vue.use(VueRouter);
    Vue.use(Vuex);