1.創(chuàng)建工程
目的：vue3+vite+ts
- 安裝依賴，安裝vite的工具
Vite下一代的前端工具鏈為開發(fā)提供極速響應(yīng)v4.3
npm install -g create-vite
- 創(chuàng)建工程
create-vite font-userui --template vue-ts
–template vue-ts 后面的是配置模板，有很多，也有react，官網(wǎng)有介紹
- 啟動(dòng)工程
cd .\font-userui\
npm i
npm run dev
- 安裝路由
npm install vue-router@next
- 配置vite-env.d.ts
為了讓ts識(shí)別.vue文件
declare module "*.vue" {
import { DefineComponent } from "vue";
const component:DefineComponent<{},{},any>
export default component
}
- 安裝element-plus
npm install element-plus
注意vue3用的是element-plus別裝錯(cuò)版本了
最終main.ts文件
import { createApp } from 'vue';
import App from './App.vue';
import router from "./router";
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
const app = createApp(App);
app.use(router);
app.use(ElementPlus);
app.mount('#app');
- 前端頁面：
2.1. 登錄頁面：
登錄頁是偷本站博主的
- 簡(jiǎn)約登錄頁 簡(jiǎn)約登錄頁分享
主要頁面暫時(shí)就這一點(diǎn)，屬實(shí)有點(diǎn)吃力。
一邊在靠駕照，一邊寫這，前端真不是人干的活，又多又雜，嗚嗚嗚！文章來源：http://www.zghlxwxcb.cn/news/detail-573275.html
暫時(shí)寫到這里，后面會(huì)繼續(xù)更新文章來源地址http://www.zghlxwxcb.cn/news/detail-573275.html
到了這里，關(guān)于vue3項(xiàng)目創(chuàng)建（vite3+ts+elementui-plus）的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
