首页 > 其他分享 >第8篇 vue开发环境搭建

第8篇 vue开发环境搭建

时间:2024-08-25 22:15:58浏览次数:5  
标签:npm vue cnpm nodejs 路径 开发 镜像 安装 搭建

window系统上部署vue的开发环境

1.安装nodejs

1.1下载并安装node.js
在浏览器中打开nodejs官网https://nodejs.org/zh-cn/ ,选择需要的版本直接点击即可下载,可以选择长期支持的版本【自由选择】
image

image
然后就是一系列的“下一步”
image

image

image

image

image

image

image

image

image

2.检查nodejs是否安装成功

打开cmd,输入命令 node -v, 如果看到了刚才下载的版本号,则表示已经安装成功
image

3.安装cnpm

虽然nodejs自带npm,但是在国内由于网速的限制可能下载一些组件包会比较慢,所以可以根据自身情况安装并使用淘宝cnpm镜像(国内使用下载速度比较快)
在cmd中运行命令

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

如果出现以下的错误信息,说明这个镜像已经过期,不再维护,所以域名证书过期也不更新了。 需要切换为新的淘宝镜像:
image

先更新配置新的淘宝镜像
image
image

确认是否已生效
image

然后再次使用 npm install 就可以正常工作了。
image

安装完成后,可以输入 cnpm -v进行查看
image

如果报了以上的错误,该怎么办:
真正的执行路径是C:\Program Files\nodejs\node_global,你需要依据自己的nodejs和cnpm安装实际路径去添到系统环境变量里。然后再执行cnpm命令就ok了。
比如我安装的nodejs实际是在D盘的,那么就得给这个路径设置系统变量
image
image

image
image

在用户变量下,新建一个“NODE_PATH”,值为“D:\Program Files\Nodejs” 【注:这个路径就是你的实际nodejs安装的路径】

image

然后在path新建一个环境变量

image

接着在系统变量中的Path 添加“%NODE_PATH%”变量

image

执行完成以上步骤就可完成环境变量的配置

然后执行命令:npm -v ,出现版本号说明可以了
image
配置 prefix和cache的路径地址
image

可以选择安装框架:nodeJS的Express框架

4.内容

标签:npm,vue,cnpm,nodejs,路径,开发,镜像,安装,搭建
From: https://www.cnblogs.com/chenshibao/p/18379074

相关文章

  • Qt+OpenCascade开发笔记(二):Qt引入occ库,搭建工程模板发布Demo
    前言  OpenCASCADE是由OpenCascadeSAS公司开发和支持的开源软件开发平台,旨在为特定领域快速开发程序而设计。它是一个面向对象的C++类库,提供了丰富的几何造型、数据交换和可视化等功能,成为许多CAD软件的核心组件。  本篇描述搭建Qt开发occ环境过程。Demo  注意......
  • 2024年云南省职业院校技能大赛中职组 “移动应用与开发”赛项竞赛样卷
    2024年云南省职业院校技能大赛中职组“移动应用与开发”赛项竞赛样卷移动应用开发交流进步裙:958892296文章目录2024年云南省职业院校技能大赛中职组“移动应用与开发”赛项竞赛样卷模块A:移动应用界面设计模块B:移动应用前端开发模块C:移动应用测试与交付一、......
  • 2024年云南省职业院校技能大赛中职组“网络搭建与应用”赛项竞赛样卷
    2024年云南省职业院校技能大赛中职组“网络搭建与应用”赛项竞赛样卷文章目录2024年云南省职业院校技能大赛中职组“网络搭建与应用”赛项竞赛样卷第一部分:网络理论测试(100分)第二部分:网络建设与调试(400分)第三部分:服务搭建与运维(500分)竞赛说明一、竞赛内容分布......
  • 基于java+springboot+vue的刷题系统微信小程序
    ......
  • Chapter 03 Vue指令(下)
    欢迎大家订阅【Vue2+Vue3】入门到实践专栏,开启你的Vue学习之旅!文章目录前言一、v-on指令二、v-for指令三、v-bind指令四、v-model指令前言在Vue.js中,指令是带有v-前缀的特殊属性,不同属性对应不同的功能。通过学习不同的指令,我们能够灵活应对多种业务场景......
  • 【HarmonyOS NEXT应用开发】案例99:基于HiAppEvent能力的应用崩溃监控上报
    HiAppEvent介绍:HiAppEvent的接口设计,由系统决定回调的时机。使用这种机制,可以获取的应用崩溃事件结构化日志。HiAppEvent运营&运维事件软件模块,用于连接APP开发者、APM上传模块、HiView故障维测服务。支撑应用开发者完成运营和运维的数据分析工作。主要通过如下措施支持开发......
  • 【HarmonyOS NEXT应用开发】案例98:HiLog日志能力介绍
    ⦁   日志打印及显示。日志打印格式:日期时间进程号线程号日志级别domainID/日志标签:日志内容如下所示,这是一条domainID为0x003200和标签是"testTag"的info级别的日志:04-1917:02:14.735 5394 5394IA03200/testTag:thisisainfolevelhilog说明:日志级......
  • 基于springboot+vue.js的牙科就诊管理系统附带文章源码部署视频讲解等
    文章目录前言详细视频演示具体实现截图核心技术介绍后端框架SpringBoot前端框架Vue持久层框架MyBaits为什么选择我代码参考数据库参考测试用例参考源码获取前言......
  • 基于ssm+vue.js的附学费管理系统带文章源码部署视频讲解等
    文章目录前言详细视频演示具体实现截图核心技术介绍后端框架SSM前端框架Vue持久层框架MyBaits为什么选择我代码参考数据库参考测试用例参考源码获取前言......
  • [Vue] useVModel
    Onewaydatabinding,theparentcomponentpasingdatathrough v-modeltochildcomponent,ifchildmodifythedata, v-modelwilltakecareemitthechangedbacktoparentcomponent.Thisparttenworksfine.Buttheremightbesomeproblem,forexample,wha......