优好科技

在电脑指定文件夹下,鼠标右键选择Git Bash Here

简介: 1、在电脑指定文件夹下,鼠标右键选择Git Bash Here,然后输入命令cnpm install --global vue-cli 安装vue-clicnpm install --global vue-cli2、接

1、在电脑指定文件夹下,鼠标右键选择Git Bash Here,然后输入命令cnpm install --global vue-cli 安装vue-clicnpm install --global vue-cli2、接着使用命令:vue init webpack wanm,创建一个基于webpack模板的新项目vue init webpack wanm3、切换工作目录cd wanm/,然后运行项目:npm run dev运行项目:npm run dev4、如果要在vue框架项目中使用echarts,需要安装echartsnpm install echarts -Snpm install echarts -S5、打开HBuilderX开发工具,导入项目wanm导入项目wanm6、在src/components文件路径下,新建vue文件ColumnChart.vue新建vue文件ColumnChart.vue7、在组件ColumnChart.vue文件中,插入一个div,带有id属性和style

插入图形容器8、接着在script标签中,导入echarts,然后初始化变量width和heightimport echarts from 'echarts'Vue.prototype.$echarts = echartsexport default {data() {return {width: '1800px',height: '900px'}}}导入echarts,初始化变量width和height9、初始化图形,绑定图形数据源和相关属性初始化图形,绑定图形数据源和属性10、打开项目中的index.js文件,导入组件ColumnChart,并配置路由导入组件ColumnChart,并配置路由11、保存代码并使用命令运行项目,结果出现报错;检查代码发现,没有导入vue导入vue模块12、修改代码后,刷新浏览器,可以查看到一个柱状图打开浏览器,预览柱状图效果


以上是文章"

在电脑指定文件夹下,鼠标右键选择Git Bash Here

"的内容,欢迎阅读优好科技的其它文章