java开发——idea下运行vue工程

以下教程将从头完成idea开发工具运行vue项目的全过程

一、准备工作：

1.1 idea下载安装：https://blog.csdn.net/qq_15903671/article/details/81739295

1.2 node.js下载安装：https://blog.csdn.net/qq_15903671/article/details/82052035

1.3 npm 下载安装：https://blog.csdn.net/qq_15903671/article/details/82052251 

二、使用idea加载现有vue项目运行

2.1 idea下创建一个空的web项目

输入Project name后点击finish

idea下方有Terminal类似cmd命令行，输入node -v 和 npm -v 检查一下是否完成node.js的安装

2.2 安装vue工程需要的其他组件

修改npm的registry属性，因为默认的registry地址真的很慢，网上也有建议下载cnpm的，不过vue里有描述，使用cnpm会出现莫名其妙的bug

修改npm的proxy属性，公司办公网路可能需要代理才能从互联网上采集资源

安装vue-cli：  npm i -g vue-cli

如果在运行npm i -g vue-cli时报错  ERR EPERM 的话，尝试清除缓存之后再安装vue-cli

清除缓存指令  npm cache clean --force 

vue-cli安装完成后使用 vue -V 指令查看一下版本，验证一下vue-cli是否安装完成

2.3 初始化项目脚手架

建好项目之后cd 到项目根目录

执行 vue intall 指令！！！  这个指令可能会报错，比如chromeDriver镜像下载不到，需要手工从淘宝的镜像里现在一下

处理按成后再次运行vue install  成功

2.4 运行vue项目看看效果

npm run dev

三、idea下运行vue项目

点击Add Configuration...配置一个npm的Templete

package.json 到项目里找到对应文件，Command 选择run，scripts选则dev

就可以直接在idea下运行vue项目了。