1.nodeJS版本 10.23.0 (vue项目中sass4.0版本号对应-https://blog.csdn.net/weixin_44748205/article/details/115118322)
下载路径: https://nodejs.org/zh-cn/download/releases/
检测: win+R输入cmd回车打开命令窗口,输入node -v 显示版本号则全局环境配置成功了
2. 安装 npm包管理工具(node10.0对应6.14.8版本)(node10.23.0版本自带了,直接输入命令验证)
npm(node package manager)nodejs的包管理器,用于node插件管理(包括安装、卸载、管理依赖等)
检测: 打开cmd输入npm -v 出现版本号则成功
此处说明下:新版的Node.js已自带npm,安装Node.js时会一起安装,npm的作用就是对Node.js依赖的包进行管理,也可以理解为用来安装/卸载Node.js需要装的东西
进入到nodejs安装目录下点击执行npm.cmd文件生成node_global 文件(以管理员身份运行) 或 手动创建npde_global文件夹
加快npm启动速度(3种方式)
1.使用以下命令:npm config set registry=http://registry.npm.taobao.org/
2.使用全局设置的命令:
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
3.找到node.js的安装目录,进入nodejs\node_modules\npm找到文件npmrc,打开后在该文件末尾加上这一行 registry = https://registry.npm.taobao.org
3.安装express(安装命令: npm install express -g)(以管理员身份运行CMD命令窗口再执行) 或 手动创建 node_cache 文件夹
Express 是一个基于 Node.js 平台的极简、灵活的 web 应用开发框架,它提供一系列强大的特性,帮助你创建各种 Web 和移动设备应用。
4.安装CNPM 包管理工具
安装命令: npm install -g cnpm --registry=https://registry.npm.taobao.org
npm是node官方的包管理器。cnpm是个中国版的npm,是淘宝定制的 cnpm (gzip 压缩支持) 命令行工具代替默认的 npm。
手动配置环境变量:
win10: 桌面 -> 单机右键 -> 属性 -> 高级系统设置 参考下图:
检验: cnpm -v
5.安装yarn 包管理工具 (https://yarn.bootcss.com/docs/)
安装命令: npm install yarn -g
Yarn是由Facebook、Google、Exponent 和 Tilde 联合推出了一个新的 JS 包管理工具 ,正如官方文档中写的,Yarn 是为了弥补 npm 的一些缺陷而出现的。
检验: yarn -v
#缓存目录修改:
npm的本地仓库跑在系统盘c盘的用户目录了(没见到npm-cache是因为没有用过,一使用缓存目录就生成了),我们试图把这2个目录移动回到D:\software\nodejs\
(1)首先确认nodejs文件夹下是否存在node_cache、node_global两个文件夹,没有则需要创建
然后cmd运行以下2条命令(一定要注意自己的路径,复制的时候一定要注意空格):
npm config set prefix "D:\software\nodejs\node_global "
npm config set cache "D:\software\nodejs\node_cache"
检验: 查看npm默认安装路径 npm config get prefix
显示D:\software\nodejs \node_cache则修改成功
#安装说明:
杠(-S) 即 save(保存)
包名会被注册在package.json的dependencies里面,在生产环境下这个包的依赖依然存在
杠(-D) 即 dev(生产)
包名会被注册在package.json的devDependencies里面,仅在开发环境下存在的包用-D,如babel,sass-loader这些解析器
6.测试(以管理员身份运行CMD命令窗口再执行)
(1)安装vue (vue脚手架不同版本的区别和介绍_一位前行者的博客-CSDN博客_vue脚手架和vue的区别)
npm install vue -g
(2)安装脚手架
2.9.6版本的安装:npm install -g vue-cli
3.0.0版本的安装:npm install -g @vue/cli
检验vue: vue -V
(3)安装webpack
PS:不要忘记webpack4.+开始webpack-cli是必备的哦 版本号一定要对应
npm install --g webpack@4.44.2 webpack-dev-server@3.11.2 webpack-cli@3.3.12
(4)创建vue项目测试(这里的版本号是指脚手架的版本号)
2.9.6 初始化项目是用 vue init webpack my-project
3.0.0 以上初始化项目是用 vue create my-project
打开cmd窗口,进入指定文件夹,输入初始化项目语句…
运行项目输入网址,访问成功说明环境搭建成功~
参考下图:
-------------------------------------------错误信息--------------------------------------------------------
1.npm安装yarn报错
错误码:
Error: Could not create the Java Virtual Machine.
Error: A fatal exception has occurred. Program will exit.
原因: 由于node.js中的yarn和hadoop的冲突了,系统环境变量也都配置了全局环境。
网上解决方案: https://blog.csdn.net/weixin_46759393/article/details/117968453
我的解决方案: 异想天开的我这么做的,把node相关环境变量放在HADOOP之前,居然成功了!!!
万能大法,重启电脑~
然后再执行yarn -v居然显示了版本号。
将node配置路径移到HADOOP之前:
2.vue-element-admin-master项目安装依赖报错
错误码:
npm ERR! C:\Program Files\Git\cmd\git.EXE ls-remote -h -t https://github.com/nhn/raphael.git
npm ERR! fatal: unable to access 'https://github.com/nhn/raphael.git/': OpenSSL SSL_read: Connection was reset, errno 10054
npm ERR! exited with error code: 128
原因:
解决方案:
清空缓存命令(如果终端执行不了就打开cmd窗口执行): npm cache clean --force
使用淘宝镜像: npm config set registry https://registry.npm.taobao.org
重新安装依赖: npm install
3.git导出项目失败
错误码: fatal: unable to access 'https://github.com/taylorchen709/vue-admin.git/': Empty reply from server
解决方案: 将git clone https:// github...... 改成 git clone git:// github…
4. 安装node-sass报错时执行
错误码: npm ERR! node-sass@4.14.1 postinstall: `node scripts/build.js`
原因: 网速不好或者版本过高,用淘宝镜像安装
解决方案:
配置一下淘宝镜像: npm config set sass_binary_site=https://npm.taobao.org/mirrors/node-sass
重新安装依赖: npm install