VUE的环境安装node14.21--【环境篇】

原创已于 2025-06-09 15:50:00 修改 · 2.5k 阅读

26 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #rust #前端

于 2024-02-27 14:28:50 首次发布

前端技术专栏收录该内容

10 篇文章

订阅专栏

Python3.10

Conda

Python

Python 是一种高级、解释型、通用的编程语言，以其简洁易读的语法而闻名，适用于广泛的应用，包括Web开发、数据分析、人工智能和自动化脚本

文章目录

本系列校训
安装环境的选择
- 原因
- 选择某宝
自己动手，丰衣足食
本文资源：

本系列校训

用免费公开视频，卷飞培训班哈人！打死不报班，赚钱靠狠干！只要自己有电脑，前后项目都能搞！N年苦学无人问，一朝成名天下知！

安装环境的选择

原因

因为之前写的那一篇版本升级，还有就是一些路由连不上，但是之前的有一些又是有用的，
没办法，只好再重写一篇新的了。

选择某宝

英语不行的，看命令行晕的，请乖乖的花钱去某宝，让别人远程你得了。
在这里插入图片描述

唯一可以以稍低价获得远程调试，全程服务的某宝，那还不是妥妥的给你搞定呀？但是这一次又翻了，因为淘宝上定价才10元左右。所以，我身边的人还是有几个去试了试，就是会弄，让客服远程给你干干净净的装一遍也值了。
但是没想到，对方只给安了node.js 的最新版，然后，把VUE的welcome 项目弄出来就不管了。VUE项目编译不过去的，要加钱，加多少？不一定，看项目复杂程序。这…

自己动手，丰衣足食

首先按老习惯要东西理整一下。
在这里插入图片描述
要注意的是，VUE环境的安装，是 1 2 3 4 ，这样的顺序。
但是呢，因为2最复杂，所以，在按1之前，先要看一个表。

这是一个什么鬼？这是一个vue 的环境的同命索！
你安什么版本的node.js 就得安哪个版本的node-sass，如果你真的找了某宝小店，他上来去node.js的官网上找到了一个最新版安上了，然后，…你要想编译项目，只能把这个卸载了，因为没有相应版本的node-sass。
这是一套很多大佬比较喜欢的一套版本。

vue 安装
node:
v14.21.0;
node-sass:
^4.14.1;
sass-loader:
^7.3.1;

因为node安装其它的组件库的时候，还有有很多的警告，会说这个不是最新版等。而上面的那套版本是警告最少的。

（1)node.js

安装这个倒没啥好说。
Node.js 历史版本下载地址：https://nodejs.org/dist/
现在node14的最新版是14.21.3 那就用这个版。
在这里插入图片描述

（2)node-sass

要注意的是你已经安装好了node.js。
下面的命令都是在命令行下进行的。如果你还不会打开命令行…那我还是劝你去淘宝上花点钱，先观摩一下别人操作。
如果你悟性高Win+R 吧。

1 设置代理（千万不要设置淘宝这个链接已失效，直接进入第三步）

npm config set registry http://registry.npm.taobao.org/

目前有效的几个：其他镜像

npm config set registry https://registry.npmmirror.com/
这个地址其实前身就是淘宝的地址。目前最稳定

阿里云NPM镜像‌
地址：https://npm.aliyun.com
特点：适合阿里云用户，稳定性高23。
‌腾讯云NPM镜像‌
地址：https://mirrors.cloud.tencent.com/npm/
特点：覆盖范围广，服务稳定23。
‌华为云NPM镜像‌
地址：https://mirrors.huaweicloud.com/repository/npm/
特点：适配华为云开发环境23。
‌京东镜像（JFrog Artifactory）‌
地址：https://registry.jfrog.org/npm/registry
特点：支持高并发，适合企业级需求1。

高校镜像站

‌中国科学技术大学镜像‌
地址：http://mirrors.ustc.edu.cn/
特点：开源镜像站，支持多协议3。
‌清华大学镜像‌
地址：https://mirrors.tuna.tsinghua.edu.cn/
特点：更新及时，社区维护活跃3。

2设置插件仓库地址（也没有用了，千万不要设置这个链接已失效，直接进入第三步）

在这里插入图片描述

（2.1)3安装 VS 2017 with Desktop Development Kit for C++

你没看错，这个东西要安装的是VS 全套里的工具。不是VS-code.

vs_buildtools 下载地址：https://visualstudio.microsoft.com/zh-hans/thank-you-downloading-visual-studio/?sku=BuildTools

vs_community 下载地址：https://visualstudio.microsoft.com/zh-hans/thank-you-downloading-visual-studio/?sku=Community

在这里插入图片描述
经过两段漫长的时间，终于安装好了。如果这一步安装不好，那说明你很有可能跟VUE不得不拜拜了。

（2.2)安装 python 3.0

Python 下载地址：https://www.python.org/downloads/
我当时的机器里用的node.js 是14，安node-sass 的时候，要求我安python3.0以上。现在只提供一个node14版本的，没有分支。
还是那句，不会改path 系统参数的。又得百很久了。

（2.3)最后安装 node-sass

npm install node-sass@4.14.1

如果这一步安装正确了。那你真的应该庆祝一下了。因为最难的部分你都搞定了。甚至你都可以把C盘备份一下的。
不会的，打这个命令晕晕的，那就多装几次吧。如果学习过linux 的话，可能对这些感觉会好很多。同样的python 也是这样的环境安装方式。

（3)安装其它依赖包



npm install vue@2.6.x vue-router@3.1.x

npm install webpack@4.39.x webpack-cli@3.3.x  

npm install webpack-dev-server@3.8.x html-webpack-plugin@3.2.x 

npm install vue-loader@15.7.x vue-template-compiler@2.6.x 

npm install css-loader@3.2.x style-loader@1.0.x 

npm install less@4.2.0 less-loader@12.2.0 

npm install sass-loader@7.2.x

npm install stylus@0.62.0 stylus-loader@8.1.0 

npm install url-loader@2.1.x file-loader@4.2.x