前提
需要确保node.js还有vue-cli的的存在
没有安装node.js可以点击下列教程去安装nvm进而安装node.js
tip:npm是Node.js默认的软件包管理系统,安装完毕node后,会默认安装好npm。
安装完node之后npm install -g @vue/cli
nvm的安装,nvm调节node版本增删查改
1.vue-cli脚手架的可视化创建
(切换到D盘然后创建项目比较好)
(这里教一种快捷方式打开cmd在路径中直接输入cmd然后回车就可以直接打开这个路径下的cmd )
cmd输入 vue ui 打开图形化界面vue项目管理器(在项目创建和配置的过程中cmd不能关)(值得注意的可以去谷歌游览器上下载一个插件devtool游览器插件帮助分析vue.js程序)
然后会自动弹出这个页面
图形化创建项目:
点击创建选择路径创建项目记得初始化git仓库(到时候git绑定仓库使用git进行版本管理)
vue2的项目预设选择vue2
然后点击创建之后出现项目的仪表盘
然后安装插件vue-router
点击搜索之后安装以下插件
配置Element-UI:在插件中安装,搜索vue-cli-plugin-element
配置Axios:在依赖中安装,搜索axios(运行依赖)
一些基础的安装完了之后
找到你的文件夹然后用vscode打开
然后就创建好了
运行的时候就是这样子运行
运行之后启动app
然后页面就出来了
打包的话就是在下一栏的bulid运行进行打包
2.命令行参数创建
上下选择回车确定,我这里直接选择了vue2
进入目录然后运行
然后运行后的页面就是
导入element ui
选择全部导入别选按需导入,不然后面你做项目需要一个个导入组件太麻烦了
选择要加载的区域设置(使用箭头键)(作为一个前端 至少得有个nvm用于切换node版本 而不是简单的卸载安装)
如果出现这个问题的话
项目package.json的配置太低,用最新版的node运行不起来
解决方式:
1.安装 node v12.13.1,nvm用于切换node版本
2.再重新拉取项目, 或者删除node_module
导入路由