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项目了。

 

 

 

 


版权声明:本文为qq_15903671原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。