一、创建项目
1、查看是否安装好:vue -V
2、创建项目:vue create learn-vue-cli
3、安装完cd到当前目录 code learn-vue-cli
4、启动调试:npm run serve
5、做完打包:npm run build,打包后会生成dist文件
6、cd到dist,执行:serve .指令可打开服务
二、创建单页面组件
1、在components文件夹下新建.VUE文件
2、在template中书写文本内容及容器id
3、在script中设置导出
export default {
name: "test",
props: {
msg: String,
},
};
4、在App.vue文件script设置组件引入及组件的注册
import test from "./components/test.vue
export default {
name: "App",
components: {
test
},
};
5、在App.vue文件template中使用组件
<test msg="Welcome to test" />
6、组件中定义属性及方法
data(){
return{
title:0
}
},
methods:{
geetr:function(){
this.title+=1
}
}