VUE-配置-流程

VUE-配置-流程

---1---.安装 NVM:

---2---.用NVM:安装node.js   :
修改源:
nvm root 命令,可以查看nvm的安装根路径在那个文件夹
root地址,找到setting.txt文件并打开
复制粘贴以下代码, 保存完成nvm源修改:
node_mirror: https://npmmirror.com/mirrors/node/
npm_mirror:  https://npmmirror.com/mirrors/npm/


查看所有 node js 版本:

nvm list available
安装指定的版本:nvm install 17.9.1
查看安装的所有版本:nvm list 或 nvm ls
进入或切换版本:nvm use 17.9.1 (录入:nvm use 17  就可以)

检查是否安装成功: node -v 查看node的版本、npm -v 查看npm的版本

---3---.用NVM:安装npm: (nvm  安装 node js 会自动安装 npm V8.11.0)

设置 npm  代理 :npm config set proxy=http://192.168.1.173:17890


---4---.用npm:安装yarn:

npm install -g yarn

yarn --version

---5---. 安装项目依赖:npm i  (高版本npm 出错用 npm i --legacy-peer-deps )

npm i --legacy-peer-deps

原因:npm 升级到 7.x以上后,会出现上游依赖冲突;–legacy-peer-deps:安装时忽略所有 peerDependencie,默认使用npm 4-6版本的安装模式,安装过程中是会跳过对等依赖项。

---6---.用yarn 测试项目: yarn dev


---7---.启动:编译:

查看: 项目 package.json 里的 "scripts": {
    "dev": "set NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",
    "build:prod": "set NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build",
    "build:stage": "vue-cli-service build --mode staging",
    "preview": "node build/index.js --preview",
    "lint": "eslint --ext .js,.vue src"
  },
  配置信息: 使用以下可启动 编译:
 npm run build:prod
 
 
 
 ===2.
 ---安装依赖库
 npm install -g cnpm --registry=https://registry.npm.taobao.org
 cnpm install 
 
 ---打包编译:
1、切换到项目根目录下,运行打包命令
cnpm run build  #相关文件被打包
结果报错npm ERR! missing script: build,后来发现package.json中scripts参数为 
2.根据package.json输入正确命令:
 cnpm run build:prod --report
 
 
 cnpm run build:prod --report
 
 =====报错处理:
 
 
 error:0308010C:digital envelope routines::unsupported

 
报错error:0308010C:digital envelope routines::unsupported

出现这个错误是因为 node.js V17版本中最近发布的OpenSSL3.0, 而OpenSSL3.0对允许算法和密钥大小增加了严格的限制,可能会对生态系统造成一些影响.


方法一:OK:

  "scripts": {
    "dev": "set NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",
    "build:prod": "set NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build",
    "build:stage": "vue-cli-service build --mode staging",
    "preview": "node build/index.js --preview",
    "lint": "eslint --ext .js,.vue src"
  },

 
 ======
 报错These dependencies were not found 解决办法
项目启动后报错如下
解决办法:
1、删掉node_moudles文件夹
2、使用npm install 重新安装所有依赖包

如果安装所有依赖包时报错如下

这个报错可能因为npm版本过高,所以对某些命令比npm6.x更严格

这时在npm install 命令后加–legacy-peer-deps,重新运行命令安装即可。
 
 cnpm install –legacy-peer-deps
 cnpm run build:prod --report
 
 
 npm run build:prod && rd /s /q
 
 
 npm run build:prod && rd /s /q "C:\00.demonstration\nginx-1.24.0\BJhtml\static" && xcopy dist C:\00.demonstration\nginx-1.24.0\BJhtml  /s/y
 
 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/570866.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

三、CPU基础-缓存

计算机中缓存一般分为两个部分 1.内存 2.CPU Cache 一、CPU Cache分级 CPU Cache 通常分为大小不等的三级缓存,分别是 L1 Cache、L2 Cache 和 L3 Cache。 L1 Cache 和 L2 Cache 都是每个 CPU 核心独有的(通常会分为「数据缓存」和「指令缓存」&#…

Git--原理与使用

目录 一、课程目标二、初始Git三、安装Git3.1 Linux-centos 四、Git的基本操作4.1 创建Git本地仓库 五、配置Git六、认识工作区、暂存区、版本库七、添加文件八、查看.git九、修改文件十、版本回退十一、撤销修改11.1 情况一:对于工作区的代码,还有add11…

海康NVR接入视频监控平台部分视频浏览失败,显示503错误的解决办法

目录 一、问题概述 二、问题排查 (一)排查思路介绍 (二)平台排查 1、确定排查的思路 2、信令控制模块的排查 3、媒体转发模块的排查 (三)客户设备排查 1.观察正常视频的设置 2. 调查问题原因 三…

B端设计实战:基于角色属性的权限设计

编辑导读:“权限控制”是中后台的基础能力,用于管控操作人员在平台内可做的事项内容。即通过权限控制,可以决定哪些人在平台内可以做哪些事。本文作者围绕角色&属性的权限设计展开分析,希望对你有帮助。 Hello,我是一名交互设计师。 随着3月暖春的即将到来,苏州的疫…

足球场体育馆三维可视化:颠覆传统观赛体验,开启视觉新纪元

在数字化浪潮席卷全球的今天,三维可视化技术正以其独特的魅力引领着体育场馆建设的革新潮流。这一技术的出现,不仅为观众带来了前所未有的视觉享受,更在体育产业的发展中,开启了一扇通往未来的大门。 足球场体育馆三维可视化&…

YOLOV1学习笔记

1. 前置知识简介 1.1 方向梯度直方图(HOG, Histogram of Oriented Gradient) 在计算机视觉以及数字图像处理中方向梯度直方图是一种能对物体进行检测的基于形状边缘特征的描述算子(用于量化图像局部特征的算法工具,它将图像中的…

string 类以及模拟实现

𝙉𝙞𝙘𝙚!!👏🏻‧✧̣̥̇‧✦👏🏻‧✧̣̥̇‧✦ 👏🏻‧✧̣̥̇:Solitary_walk ⸝⋆ ━━━┓ - 个性标签 - :来于“云”的“羽球人”。…

Flutter 中优雅切换应用主题的组件

Flutter 中优雅切换应用主题的组件 视频 https://youtu.be/L–XLpc452I https://www.bilibili.com/video/BV1wD421n75p/ 前言 原文 https://ducafecat.com/blog/flutter-app-theme-switch Adaptive Theme 这个组件通过包裹 MaterialApp 的方式整体管理 theme 主题&#xff0…

Java冲突

本身 父类 接口(多) 如果出现同样名字的方法,就会出现冲突 * 情况描述1: * 当一个类,继承了父类,实现了某接口,父类中的成员方法和接口中的方法重名 * 解决方法: * 子类就近选择父类成员方法 亲爹优先原则 * *使用格式: * 父类:super.方法名 * 父接口:父接口名.super.方…

QT——其他方式实现HelloWrold

QT——其他方式实现HelloWrold 使用输入框实现使用代码实现 通过按钮实现信号槽代码方式实现 我们之前对QT实现HelloWorld有了一些基本的了解,用了一些简单的方法实现了HelloWorld,如果对QT还不怎么了解的,可以点击这里: https://…

算法提高 第一期 KMP扩展算法

1## 具体思路: 和KMP算法的是想类似,充分利用已经比较字符性质来减少冗余的字符比较次数。KMP的思想是充分的利用模式串中所有前缀字串(以模式串为开头的字串)的真前缀和真后缀(指子串的开始字符与子串的最后字符相等的…

【C 数据结构】二叉树

文章目录 【 1. 基本原理 】1.1 二叉树的性质1.2 满二叉树1.3 完全二叉树 【 2. 二叉树的顺序存储结构 】2.1 完全二叉树的顺序存储2.2 普通二叉树的顺序存储2.3 完全二叉树的还原 【 3. 二叉树的链式存储结构 】【 4. 二叉树的先序遍历 】4.1 递归实现4.2 非递归实现 【 5. 二…

MongoDB磁盘空间占满,导致数据库被锁定,如何清理数据和磁盘空间

一、问题 1、我在实际项目中,遇到一个问题,随着数据每天的不断增加,导致mongodb的磁盘空间站满了,数据库被锁了,无法使用。 2、故障表现 部署的应用程序突然无法将数据写入数据库,但是可以正常读取数据。…

栈和队列详解

目录 栈栈的概念及结构栈的实现数组栈的实现数组栈功能的实现栈的初始化void STInit(ST* pst)初始化情况一初始化情况二 代码栈的插入void STPush(ST* pst, STDataType x)代码 栈的删除void STPop(ST* pst)代码 栈获取数据STDataType STTop(ST* pst)代码 判断栈是否为空bool ST…

裸金属服务器是什么

自推出裸金属服务器以来,它一直断断续续地出现在我们面前。最近,关于裸金属服务器、什么是裸金属服务器、裸金属服务器可以做什么、数据托架共享的讨论越来越多: 裸金属服务器(bare metal server,BMS)的官…

如何在OpenWRT上配置SFTP远程文件传输

如何在OpenWRT上配置SFTP远程文件传输 OpenWRT 是一款广泛使用的开源路由器固件,它能够让普通的家用路由器具备高级路由功能,提供更多自定义和优化选项。本文将介绍如何在OpenWRT上配置SFTP(SSH文件传输协议)服务,以便…

js生成不同的阅读数分配到每一篇上面,不会因为刷新而变动

js生成不同的阅读数分配到每一篇上面,不会因为刷新而变动 {%- for article in blog.articles -%}<div class"blog-articles__article article">{%- render article-card,article: article,media_height: section.settings.image_height,media_aspect_ratio: a…

面试遇到算法题:实现LRU缓存

请你设计并实现一个满足 LRU (最近最少使用) 缓存约束的数据结构。 这是一道大厂面试高频出现的算法题&#xff0c;难度为⭐️⭐️⭐️&#xff0c;属于中等&#xff0c;老铁们来一起看看这个题该怎么解&#xff1f; 1. 原题再现 没有废话&#xff0c;翠花&#xff0c;上酸菜&…

CountDownLatch使用错误+未最终断开连接导致线程池资源耗尽

错误描述&#xff1a; 我设置了CountDownLatch对线程的协作做出了一些限制&#xff0c;但是我发现运行一段时间以后便发现定时任务不运行了。 具体代码&#xff1a; public void sendToCertainWeb() throws IOException, InterruptedException {List<String> urlList …

HTML的学习-通过创建相册WEB学习HTML-第二部分

文章目录 二、学习开始3.6、form元素示例&#xff1a;添加form元素示例&#xff1a;action属性添加到form属性中 3.7、input元素示例&#xff1a;在input属性中添加参数 3.8、button元素示例&#xff1a;在button中添加type元素示例&#xff1a;定义单选按钮radio 3.9、id属性示…
最新文章