手把手教你在Windows下搭建Vue开发环境

简介: 在Windows下搭建Vue开发环境:

在Windows下搭建Vue开发环境:


1. 安装node.js


官网https://nodejs.org/en/


下载地址https://npm.taobao.org/mirrors/node/v12.18.3/


安装步骤:


微信图片_20221009234111.png


微信图片_20221009234121.png


微信图片_20221009234126.png


微信图片_20221009234131.png


微信图片_20221009234136.png


2. 设置node的全局和缓存路径


在安装目录下新建两个文件夹:node_cache、node_global


微信图片_20221009234142.png

设置缓存路径:npm config set cache “E:\program\nodejs\node_cache”

设置全局模块存放路径:npm config set prefix “E:\program\nodejs\node_global”


3. 安装淘宝镜像


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


微信图片_20221009234146.png


4. 设置环境变量


设置环境变量的目的是在任何目录都可以执行node和vue命令。

path增加E:\program\nodejs\node_global


微信图片_20221009234150.png


新建NODE_PATH,值E:\program\nodejs\node_modules


微信图片_20221009234155.png

5. 安装Vue


需要先关上命令行窗口。再次打开cmd,执行安装vue命令:

cnpm install vue –g


微信图片_20221009234159.png

6. 安装Vue-cli脚手架


cnpm install -g vue@cli

报错,执行如下命令:

npm i npm -g


微信图片_20221009234205.png

npm i @vue/cli -g


微信图片_20221009234209.png


cnpm i @vue/cli -g


微信图片_20221009234213.png

7. 创建一个Vue项目

vue create first


微信图片_20221009234222.png

cd first

npm run serve


微信图片_20221009234227.png

目录
相关文章
|
2月前
|
JavaScript Windows
windows安装vue
windows安装vue
|
3月前
|
存储 安全 开发工具
windows开发环境备份,再也不怕重装系统了
【9月更文挑战第2天】在Windows系统中备份开发环境可大幅提升重装系统后的效率。本文详细介绍五个关键步骤:备份开发工具及软件包;保存配置文件;备份数据库与数据文件;确保代码仓库的安全;记录安装步骤与注意事项。遵循这些建议,重装系统时可迅速恢复开发环境,避免重复劳动。
|
4月前
|
移动开发 JavaScript Java
windows7下安装配置phonegap3.0 (cordavo)开发环境 (涉及android sdk配置)
windows7下安装配置phonegap3.0 (cordavo)开发环境 (涉及android sdk配置)
|
5月前
|
JavaScript Windows
vue 搭建开发环境(2021版)
vue 搭建开发环境(2021版)
33 1
|
6月前
|
Dart 测试技术 开发工具
Dart开发环境搭建-Windows
Dart开发环境搭建-Windows
138 7
|
5月前
|
前端开发 JavaScript 应用服务中间件
windows server + iis 部署若伊前端vue项目
5,配置url重写规则(重写后端请求) 注:如果没有Application Request Routing Cachefourcloudbdueclaim和URL重写,则是第二部的那两个插件没装上 打开iis,点击计算机->点击Application Request Routing Cache -> 打开功能
280 0
|
6月前
|
Dart 开发工具 Android开发
在 Windows 操作系统上安装和配置 Flutter 开发环境
在 Windows 操作系统上安装和配置 Flutter 开发环境
167 0
|
7月前
|
Linux 编译器 C语言
FFmpeg开发笔记(二)搭建Windows系统的开发环境
在Windows上学习FFmpeg通常较困难,但通过安装预编译的FFmpeg开发包可以简化流程。首先需要安装MSYS2来模拟Linux环境。下载并执行MSYS2安装包,然后修改msys2_shell.cmd以继承Windows的Path变量。使用pacman安装必要的编译工具。接着,下载预编译的FFmpeg Windows包,解压并配置系统Path。最后,在MSYS2环境中运行`ffmpeg -version`确认安装成功。欲深入学习FFmpeg开发,推荐阅读《FFmpeg开发实战:从零基础到短视频上线》。
114 4
FFmpeg开发笔记(二)搭建Windows系统的开发环境
|
7月前
|
移动开发 JavaScript 前端开发
学习vue3使用在线官方开发环境play.vuejs.org进行测试
学习vue3使用在线官方开发环境play.vuejs.org进行测试
113 1
|
7月前
|
JavaScript API
本地开发环境请求服务器接口跨域的问题(vue的问题)
本地开发环境请求服务器接口跨域的问题(vue的问题)
593 1