文章目錄
- 創建vue3.0項目
- 項目初始化
- 項目分辨率響應式設置
- 項目頂部信息條創建
- 頁面主體創建
- 全局引入echarts和axios
- 后臺接口創建express
- 銷售總量圖實現
- 完整項目下載
項目任何問題都可在評論區,或者直接私信即可。
創建vue3.0項目
創建項目:
vue create vueecharts
選擇第三項:
Vue CLI v5.0.8
? Please pick a preset:Default ([Vue 3] babel, eslint)Default ([Vue 2] babel, eslint)
> Manually select features
繼續選擇,然后回車:
Vue CLI v5.0.8
? Please pick a preset: Manually select features
? Check the features needed for your project: (Press <space> to select, <a> to toggle all, <i> to invert selection, and
<enter> to proceed)(*) Babel( ) TypeScript( ) Progressive Web App (PWA) Support(*) Router(*) Vuex
>(*) CSS Pre-processors(*) Linter / Formatter( ) Unit Testing( ) E2E Testing
選擇vue版本3.0:
? Choose a version of Vue.js that you want to start the project with
> 3.x2.x
剩下步驟:
運行項目:
cd vueecharts
pnpm/npm run serve
打開瀏覽器:
項目初始化
清空無用代碼和文件:
-
刪除
views
中的頁面;新建HomeView.vue
。 -
刪除
App.vue
中的多余代碼。-
<template><router-view/> </template><style lang="less"></style>
-
-
修改路由