使用vue-cli创建Vue工程化项目及单文件组件的创建和调用

文章目录
1. Vue 单文件组件的优势
把一个组件全部内容汇合到一个文件中,文件名字是以 .vue 结尾的就称作 vue 单文件组件 。
模板语法有高亮显示和代码书写提示组件创建支持样式有构建步骤,支持使用npm下载第3方库,js 高版转低版本单文件组件中的data一定要用函数的方式且一定要返回一个对象 [vd] 2. cli 创建 Vue 工程项目
安装 vue-cli
npm i -g @vue/cli## 安装成功后,检查vue --version
命令创建项目
# 首先需要进入到对应的目录中(英文目录不要有空格),执行如下命令vue create 项目名称(创建时会自己以对应的项目名称生成目录)
选择手动配置
选择要安装的项
选择vue库的版本
选择css预处理
在刚刚的配置文件以单个配置文件进行记录
对于刚选择的配置是否记录
3. 单文件组件的创建和调用
子组件(child.vue):
我是一个显示的内容 -- child/* lang 指定当前的css的预处理脚本,如果没有,则使用css,如果有一定要安装时,选中对应方案scoped样式作用域名称保护命名空间在编译的时候,给绑定的css元素添加一个不重复的hash字符串,当前属性名称,然后它在通过css3的属性选择器来完成定义样式*/.title {color: red;}
父组件(App.vue):
【使用vue-cli创建Vue工程化项目及单文件组件的创建和调用】App组件