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. 【spring boot】配置信息

    ======================================================================== 1.feign 超时配置 2.上传文件大小控制 3.J ...

  2. synchronized和volatile区别

    不同一: synchronized可以修饰方法, volatile只能修饰变量 不同二: synchronized是同步的 volatile修饰的变量具有可见性.

  3. getX,getY,getScrollX,getScrollY,ScrollTo(),ScrollBy()辨析

    前言:前两天看了自定义控件,其中有一些东西我觉得有必要深入理解一下 以下图为例: getX(),getY()返回的是触摸点A相对于view的位置 getRaw(),getRawY()返回的是触摸点B相 ...

  4. spring+activemq实战之配置监听多队列实现不同队列消息消费

    摘选:https://my.oschina.net/u/3613230/blog/1457227 摘要: 最近在项目开发中,需要用到activemq,用的时候,发现在同一个项目中point-to-po ...

  5. JVM CPU Profiler技术原理及源码深度解析

    研发人员在遇到线上报警或需要优化系统性能时,常常需要分析程序运行行为和性能瓶颈.Profiling技术是一种在应用运行时收集程序相关信息的动态分析手段,常用的JVM Profiler可以从多个方面对程 ...

  6. 微信Pcweb登录简介

    微信第三方PCweb扫码登录 准备工作 (1) 网站应用微信登录是基于OAuth2.0协议标准构建的微信OAuth2.0授权登录系统. 在进行微信OAuth2.在进行微信OAuth2.0授权登录接入之 ...

  7. (办公)记事本_Linux权限

    参考谷粒学院Linux教程:http://www.gulixueyuan.com/course/300/task/7084/show# linux权限,什么用户可以操作什么. 1.基本权限的作用: 1 ...

  8. CentOS7中_带sqlite3_CGO的golang程序_交叉编译到arm中

    CentOS7中_带sqlite3_CGO的golang程序_交叉编译到arm中 转载注明来源: 本文链接 来自osnosn的博客,写于 2019-10-28. 编写了个golang程序,用到了这个C ...

  9. TCPUDPDbg(TCP UDP 网络调试工具)

    下载链接:https://pan.baidu.com/s/1oan44qop73X5VuBcE-rjeA  提取码:v0oa

  10. C# Task TaskFactory 异步线程/异步任务

    Task是.NetFramework3.0出现的,线程是基于线程池,然后提供了丰富的API TaskFactory  提供对创建和计划 Task 对象的支持 创建和启动异步任务 1.Task task ...