vue3 环境 搭建项目

第一步 安装最新的vue vue-cli

# 最新稳定版
npm install -g vue@next
npm i -g typescript
npm install -g @vue/cli

vue upgrade --next

第二步 创建一个项目

#  创建项目
D:
cd  workspace/code
npm init vite@latest application -- --template vue
cd application 
npm install
npm run dev

第三步 安装 axios，sass等

npm i -s element-plus
npm i -s @element-plus/icons-vue
npm i -s vue-router@next 
npm i -s axios
npm i -s vue-axios
npm i sass  node-sass sass-loader  --save-dev 
npm i -s echarts
npm i -s moment  
npm i -s pinia

第四步 main.ts

// main.ts
import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import axios from 'axios'
import VueAxios from 'vue-axios'

import { createPinia } from 'pinia'
import App from './App.vue'

const app = createApp(App)

app.use(ElementPlus)
app.use(VueAxios, axios)

app.use(createPinia())
app.mount('#app')
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
    app.component(key, component);
}

项目已经发布到github上，快速构建新项目

git clone https://github.com/514840279/vue3-template.git  application
cd application
npm install
npm run dev

规规矩矩的后台管理

image.png

土里土气的登录

image.png

有没有好看的 前台效果啊，喂各位！！！
麻烦发给我