1. 下载node.js

在搭建vue的开发环境之前,先下载node.js,下载地址:https://nodejs.org/en/
https://blog.csdn.net/antma/article/details/86104068

2. 安装

下载好后安装,傻瓜式点下一步直到finish即可
https://blog.csdn.net/antma/article/details/86104068

3. 检测安装是否成功

安装成功后,一般不需要自己手动去配置环境变量,此时可以在命令行输入node -v 和 npm -v 分别查看node和npm的版本号;

4. 配置npm在安装全局模块时的路径和缓存cache的路径

在安装路径下新建两个文件夹,分别为:node_global和node_cache


  • 然后在命令行中执行如下两个命令:(报错时是因为权限不足,需要使用管理员身份打开cmd再运行下面命令)
  • npm config set prefix "C:\Program Files\nodejs\node_global"
  • npm config set cache "C:\Program Files\nodejs\node_cache"
    执行成功后:
    https://blog.csdn.net/antma/article/details/86104068
    然后在环境变量 -> 系统变量中新建一个变量名为 “NODE_PATH”, 值为“D:\Program Files\nodejs\node_modules”,如下图:

    最后编辑用户变量里的Path,将相应npm的路径改为:C:\Program Files\nodejs\node_global

    配置完成!

    5. 测试

    在cmd命令下执行 npm install webpack -g 然后安装成功后可以看到自定义的两个文件夹已生效:
    https://blog.csdn.net/antma/article/details/86104068
    webpack 也已安装成功,执行 npm webpack -v 可以看到所安装webpack的版本号:
    https://blog.csdn.net/antma/article/details/86104068

    6. 在idea中导入vue项目并运行

    setting-->plugins-->搜索vue-->选择第一个-->installed


    导入vue项目
    然后选择

    package.json为当前项目目录下的package.json文件,scripts 选择 dev

    继续添加npm
    前面一样,scripts选择bulid

    选择项目,点击

虽然会报 Opening index.html over file:// won't work.这个错误,但是好像没啥影响,在网上搜了一圈也没搞清楚啥原因
点击
输入 npm run dev

运行结果

参考博客:https://blog.csdn.net/antma/article/details/86104068

idea中导入别人的vue项目并运行的更多相关文章

  1. Eclipse中导入github上的项目

    Eclipse中导入github上的项目 转载至: http://blog.csdn.net/hil2000/article/details/8566456 1.首先在github.com上申请一个账 ...

  2. 第六十九篇:vue项目的运行过程

    好家伙, 1.vue的目录结构分析 来看看项目的目录 (粗略的大概的解释) 2.vue项目的运行流程 在工程化项目中,vue要做的事情很单纯:通过main.js把App.vue渲染到index.htm ...

  3. 4.eclipse中导入别人用的源代码问题

    最近在导入别人用的源代码问题时,出现两个问题: 问题一:提示无法解析导入,如下图: 解决方法:删除项目下的module-info.java文件即可,或者在创建项目时将创建module-info.jav ...

  4. Sumblime Text3中使用vue-cli创建vue项目,代码不高亮,解决

    问题如下:在Sumblime Text3中打开vue-cli常见的项目,代码一片灰色 解决如下: 第一步:下载文件Vue components  链接 GitHub - vuejs/vue-synta ...

  5. 关于导入别人的web项目,tomcat无法显示的问题

    这两天头大,老师讲了javaWeb项目,讲完就给我们发了代码,我就想导入直接用,结果它tomcat的add and remove 里一直没有这个项目名字 刚导入还报错,这个可能我的版本太低了,兼容不了 ...

  6. vue项目怎么运行

    因为要做毕业设计 ,准备用vue来做前端的界面.发现不知如何运行vue的项目,很尴尬.通过查阅网上教程,因此把环境搭建过程记录下来,以备不时之需.   言归正传~~   首先,列出来我们需要的东西:  ...

  7. vue 项目的运行与 打包

    1.vue init webpack 2.npm install axios 3.npm run dev  运行项目 4.npm run build 打包项目 会生成一个dist 文件夹,我们只需要把 ...

  8. 在github上怎样克隆vue项目及运行

    长时间不做vue项目,今天看vue项目运行时有些指令忘记了,在这里写下相关指令 .克隆已有项目,一般情况项目中的README.md写的是项目运行步骤,一般项目的运行如下 克隆项目 git clone ...

  9. 使用webpack打包后的vue项目如何运行(express)

    我们知道使用webpack打包vue项目后会生成一个dist文件夹,dist文件夹下有html文件和其他css.js以及图片等,那么打包后的文件该如何正确运行呢? 倘若直接打开html文件,会报如下错 ...

随机推荐

  1. C# 导出pdf(浏览器不预览直接下载)

    一.接口部分的代码 [HttpGet] public HttpResponseMessage ExportPdf(string id) { string pdfName = ""; ...

  2. 【CentOS7】设置静态IP地址

    [CentOS7]设置静态IP地址 转载:https://www.cnblogs.com/yangchongxing/p/10645871.html 图像化修改 nmtui 查看当前网卡名称 # if ...

  3. poj 3279 Fliptile (简单搜索)

    Fliptile Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 16558   Accepted: 6056 Descrip ...

  4. 《Java基础知识》Java类的基本运行顺序

    我们以下面的类来说明一个基本的 Java 类的运行顺序: public class Demo { private String name; private int age; public Demo() ...

  5. LINUX网络传输的序列化和反序列化C++

    来到公司实习,开始面向实习生有一个小项目,当然了,服务器就由我一个人来写了,1.0主要完成的使用纯C 写Linux下UDP的服务器框架,大部分还都是以前在学校做过的项目套用的,难度不大,经过跟大bos ...

  6. 用canvas写飞机大战

    1.老规矩,当我们开始做项目的时候,我们第一步就是要进行分析,当我们的游戏开始做的时候我们要把一整个游戏分成五个阶段来写: 五个阶段和我方飞机的生命值,还有游戏的得分情况如下: //游戏欢迎状态 co ...

  7. PyTorch-网络的创建,预训练模型的加载

    本文是PyTorch使用过程中的的一些总结,有以下内容: 构建网络模型的方法 网络层的遍历 各层参数的遍历 模型的保存与加载 从预训练模型为网络参数赋值 主要涉及到以下函数的使用 add_module ...

  8. FCC---CSS Flexbox: Use the flex-direction Property to Make a Column

    The last two challenges used the flex-direction property set to row. This property can also create a ...

  9. Java 密码加盐

    只对密码进行md5加密很容易反推出来,另外两个用户的密码相同时,数据库保存相同的密码,知道一个用户的密码就知道另一个.解决方法是在用户的短密码后面加上一段长字符,再计算 md5,这样反推出原始密码就变 ...

  10. Linux-换yum源

    1.打开centos的yum文件夹 cd /etc/yum.repos.d/ 2.用wget下载repo文件 wget http://mirrors.aliyun.com/repo/Centos-7. ...