1、首先,在客戶端輸入:
npm install echarts --save
2、執行完畢後,再次編譯運行
yarn run serve
可是結果沒有想到,會報此錯誤:
ERROR Failed to compile with 6 errors 下午3:32:56 These dependencies were not found: * ant-design-vue in ./src/core/use.js * ant-design-vue/dist/antd.less in ./src/core/use.js * ant-design-vue/es/icon in ./src/components/Menu/menu.js * ant-design-vue/es/locale/zh_CN in ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=script&lang=js& * ant-design-vue/es/menu in ./src/components/Menu/menu.js * vue-router in ./src/router/index.js To install them, you can run: npm install --save ant-design-vue ant-design-vue/dist/antd.less ant-design-vue/es/icon ant-design-vue/es/locale/zh_CN ant-design-vue/es/menu vue-router
3、再次安裝
yarn install
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
[1/4] Resolving packages...
success Already up-to-date.
$ opencollective-postinstall
Thank you for using vue-antd-pro!
If you rely on this package, please consider supporting our open collective:
> https://opencollective.com/ant-design-pro-vue/donate
Done in 4.99s.
4、再次編譯運行 yarn run serve, 提示編譯成功
5、打開瀏覽器,訪問後報JS錯:
echarts出現 “TypeError: Cannot read property ‘init‘ of undefined“報錯
6、在引入的地方把:
import echarts from 'echarts'
更改爲: import * as echarts from 'echarts'
刷新後,就可以看到想要的柱狀圖了。