Vue项目开发需要准备和配置些什么环境？

一、首先需要安装node.js
下载：安装node.js链接安装在D盘

window+R,输入cmd,打开命令提示符窗口，输入：

npm -v

检测是否安装成功，如果输出版本号，则表示安装成功，如图：

npm包管理工具（package manager）自动安装完成

二、改变原有的环境变量

1、首先配置npm的全局模块的存放路径、cache的路径，此处我选择放在：D:\Program Files\nodejs
输入如下命令：

npm config set prefix "D:\Program Files\nodejs\node_global"
npm config set cache"D:\Program Files\nodejs\node_cache"

如下图所示：

完成后可以在文件夹中看到相应名字的文件夹，如下：

2、在系统环境变量添加NODE_PATH,输入路径为：
D:\Program Files\nodejs\node_global
操作如下：我的电脑右击，打开属性->高级系统设置->环境变量->新建（系统变量下）->输入变量名NODE_PATH->变量值：输入上面路径，确定即可。

3、在命令行输入以下命令安装express（注：“-g”表示安装到global目录下，就是上面设置的node_global中）

npm install express -g

可以看到node_global/node_modules下有express了，如图：

4、在命令行输入node进入编辑模式，输入以下代码检测是否能正常加载模块：

require(‘express’)

如果成功，如上图显示；如果出错，检测下上面配置的NODE_PATH是否配置或者配置正确。

三、安装cnpm

1、安装cnpm，输入以下命令：

npm install -g cnpm --registry=https://registry.npm.taobao.org

2、查看cnpm是否真安装成功

cnpm -v

这样就是安装成功了

出现cnpm 是不是内部或者外部命令，不要着急配置电脑path变量

3、配置电脑变量

4、编辑系统变量

cnpm 默认的实在你的nodejs下的node_global

复制以下路径

添加到

好了，完成了，关闭黑窗口，再次打开输入

cnpm -v

结束

Vue项目开发需要准备和配置些什么环境？相关推荐

vue项目中运用webpack动态配置打包多种环境域名
在如今前后端分离,各种框架盛行的前端界,对项目的打包要求也越来越复杂,本人分享一个vue项目里,根据命令行输入不同的命令,打包出不同环境域名的方法.(欢迎纠错,谢谢.) 1. 安装插件 cross-e ...
开发vue用什么ide_VUE项目开发前期需要准备和配置些什么环境？
VUE项目开发前期需要准备和配置些什么环境? Node环境下载:https://nodejs.org/en/,安装在G盘 npm包管理工具(package manager)自动安装完成. 使用npm ...
用 cooking 搭建一个简单又优雅的 Vue 项目开发环境 (入门篇)
本文适合 Vue 的初学者,以及对 webpack 不熟悉的同学阅读.前提是你要会用基本的命令行. Node 和 NPM,以及掌握 ES2015 的基础知识.本文都是在 macOS 环境下运行,要求使 ...
Vue项目开发中使用路由懒加载
Vue项目开发中使用懒加载一.使用路由懒加载的好处当打包项目时,JavaScript包会变的非常大,影响页面加载,要是通过把不同的路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应 ...
Vue项目开发中优雅的切换服务端ip
Vue项目开发中优雅的切换服务端ip 在进行Vue开发的时候,需要配置项目对应服务端的ip地址,但如果需要在多个服务端间进行切换,通常的做法是:手动修改vue.config.js配置文件中的服务端ip ...
vue项目开发的目录结构
vue项目开发的目录结构一.通过命令行工具安装vue(npm install webpack vue-project) build -- 项目构建的相关代码 config -- 配置目录,包括端口. ...
vue项目开发实录--仿去哪儿网App-张鹏-专题视频课程
vue项目开发实录--仿去哪儿网App-160人已学习课程介绍本课程为vue项目开发实录(仿去哪儿网App)其中涉及到知识点有:组件搭建,路由,vuex,axios,webpack ...
Win10 + VSCode踩坑 + vue项目开发：设置vscode终端为管理员权限
win10系统如何设置vscode的终端为管理员权限? 一次一次的授权太麻烦! 这里直接更改授权为管理员运行即可. 操作与设置步骤: "桌面找到"VSCode"程序图标 ...
vue项目开发实现自定义Transfer穿梭框效果(结合el-tree)
vue项目开发实现自定义Transfer穿梭框效果(结合el-tree) 效果图: 直接上代码: // An highlighted block <template><el-dia ...

Vue项目开发需要准备和配置些什么环境？

Vue项目开发需要准备和配置些什么环境？

结束

Vue项目开发需要准备和配置些什么环境？相关推荐

最新文章

热门文章