单文件组件
概述
以 .vue 作为后缀名的文件,就是 Vue 中的单文件组件
组件的组成
由 三部分 组成: template 模板/ script 代码逻辑/ style 样式
为什么要使用单文件组件
- 1 原来我们使用全局组件或局部组件在使用模板的时候,是纯字符串
- 2 一个组件是由 HTML、JS、CSS 样式组成的,但是,这三部分被分离了
- 3 原来的方式,限制只能使用 HTML 和 ES5 JavaScript, 而不能使用预处理器,如 Pug 和 Babel 或 Less
使用单文件的步骤
- 1.安装
- 2.在webpack.config.js中添加loader规则配置和一个插件
- 3.创建单文件的组件
- 4.创建Vue的实例,再使用单文件组件
4.1安装 npm i vue
4.2 在main.js的文件中导入vue
4.3创建vue实例
4.4渲染App.vue单文件组件
网友评论