WIndows平台安装前端开发环境

皛心

已于 2023-03-01 00:13:22 修改

阅读量686

点赞数

CC 4.0 BY-SA版权

分类专栏：前端文章标签： npm vue.js 前端

于 2023-02-28 18:13:59 首次发布

本文链接：https://blog.csdn.net/m0_47670683/article/details/129266334

前端专栏收录该内容

17 篇文章

订阅专栏

该文详细介绍了在Windows系统中下载和安装Node.js，设置npm缓存文件夹，更新环境变量，切换至淘宝npm镜像源以加速下载，并通过VueCLI创建uni-app项目的过程，包括Vue2和Vue3项目的创建与测试运行。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

下载npm安装包

访问Node.js官网，下载64位WIndows安装包。

安装

正常安装软件，一直下一步即可。

设置运行环境

在d盘创建npm缓存文件夹，我建了个dev文件夹，里面除了放nodejs还放了HBuilderX。

mkdir -p d:\dev\nodejs\node_cache
mkdir -p d:\dev\nodejs\node_global
npm config set prefix "D:\dev\nodejs\node_global"
npm config set cache "D:\dev\nodejs\node_cache"

追加path环境变量
将D:\dev\nodejs\node_global路径添加到环境变量path里面，然后重启。

使用国内源

用下面这种方式切换国内源比较彻底，下载所有包都走国内源。

npm i -g mirror-config-china --registry=https://registry.npm.taobao.org
mirror-config-china --registry=https://registry.npm.taobao.org

安装@vue/cli

npm i -g @vue/cli

测试创建uniapp项目

创建vue2项目

mkdir -p D:\dev\HBuilderProjects
cd D:\dev\HBuilderProjects
vue create -p dcloudio/uni-preset-vue test

项目创建完毕后执行下列命令测试是否成功：

cd test
npm run serve

浏览器打开http://localhost:8080/，出现Hello表示项目创建成功，正常运行。

创建vue3项目

安装uvm
安装时的遇到下面2个问题的选择：
Ok to proceed? (y) y
? Select Package Manager npm

npx @dcloudio/uvm

创建项目

npx degit dcloudio/uni-preset-vue#vite-ts test-vue
cd test-vue
npm install --force
npm run dev:h5