tag: https://github.com/tangx/k8sailor/tree/feat/07-initial-vue3-vite2
朴实无华的界面。
安装
代码语言:javascript复制# 初始化项目
yarn create vite webapp --template vue-ts
cd webapp
## 安装依赖
yarn
## 启动查看 vue3 是否正常
yarn dev
## 安装 less 支持, 以后写样式用
yarn add less
清理环境
- 删除
/webapp/src/components
下的HelloWorld.vue
。并新建一个Deployment.vue
。这里使用 vue3 的setup
语法糖。
在 <template>
标签对中创建内容 <h3>hello deployments</h3>
<template>
<h3>hello deployments</h3>
</template>
<script setup lang='ts'>
</script>
<style lang='less' scoped>
</style>
- 修改
/webapp/src/App.vue
, 将与HelloWorld
相关的内容全部替换成Deployment
<template>
<Deployment/>
</template>
<script setup lang="ts">
import Deployment from './components/Deployment.vue'
</script>
- 运行 webapp 查看效果
yarn dev