【自用】管材流转项目前端重部署流程 vue2 webpackage4 vuecli4

news2024/12/26 18:46:57

一、配置

1.下载项目,使用 IDEA 打开,并配置 Nodejs

它提示我,需要 Node.js,因为 nodejs 14 的 installer 已经官网已经找不到了,使用 fnm 又太麻烦,
所以直接采用在 IDEA 中下载的方式就好了。

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

2.清除缓存

2.1 删掉 node_modules、package-lock.json
2.2 清除 npm 缓存:

npm cache clean --force

在这里插入图片描述

查看缓存是否清理成功:

npm cache verify

输出如下,就差不多可以了:

Cache verified and compressed (~/.npm/_cacache):
Content verified: 0 (0 bytes)
Index entries: 0
Finished in Xms

在这里插入图片描述

3.使用国内镜像源(可选)

如果你没有魔法,那么可以这样做。

配置国内镜像源:

npm config set registry https://registry.npmmirror.com

验证是否配置成功

npm config get registry

在这里插入图片描述

4.配置 webpackage 4(降级,并兼容相关依赖)

npm install webpack@4 webpack-cli@3 --save-dev
npm install vue-loader@15 webpack-dev-server@3 --save-dev

在这里插入图片描述

确保 sass-loader 兼容 webpackage 4:

npm install sass-loader@10 --save-dev

在这里插入图片描述

5.安装 vue cli 4

npm install @vue/cli-service@4 --save-dev

在这里插入图片描述

6.修改 vue.config.js

module.exports = {
  transpileDependencies: [
    "some-dependency", // 示例依赖
  ],
  devServer: {
    port: 80,
    host: "0.0.0.0",
    proxy: {
      '/api': {
        target: "https://123.57.129.116:8181",
        // 此 IP 地址已废弃
        changOrigin: true,
        pathRewrite: { '^/api': "" }
      }
    }
  }
};

7.尝试运行

npm run serve

在这里插入图片描述

虽然报了几个 WARNING,但是成功。

二、未完待续,有 bug 再改

1.

2.

三、

1.

2.

四、

1.

2.

五、

1.

2.

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

java调用ai模型:使用国产通义千问完成基于知识库的问答

整体介绍: 基于RAG(Retrieval-Augmented Generation)技术,可以实现一个高效的Java智能问答客服机器人。核心思路是将预先准备的问答QA文档(例如Word格式文件)导入系统,通过数据清洗、向量化处理…

跨平台应用开发框架(4)----Qt(系统篇)

目录 1.Qt事件 1.事件来源 2.事件处理 3.按键事件 1.组合按键 4.鼠标事件 1.鼠标单击事件 2.鼠标释放事件 3.鼠标双击事件 4.鼠标移动事件 5.滚轮事件 5.定时器 1.QTimerEvent类 2.QTimer 类 3.获取系统日期及时间 6.事件分发器 7.事件过滤器 2.Qt文件 1.输入…

算法刷题Day8:BM30 二叉搜索树与双向链表

题目 牛客网题目传送门 思路 对二叉搜索树进行中序遍历,结果就是按序数组。因此想办法把前面遍历过的节点给记下来,记作pre。当遍历到某个节点node的时候,令前驱指向pre,然后让pre的后驱指向node。 代码 class TreeNode:def…

MySQL--视图

目录 1 认识视图 1.1 视图的定义 1.1 创建视图 1.2 查询 1.3 修改 1.4 删除 1.5 视图的优缺点 1.5.1 优点 1.5.2 缺点 1.6 视图的类型 1.7 视图与物化视图 2 视图检查选项 2.1 CASCADED 2.2 LOCAL 3 视图更新及作用 3.1 视图案列结合 3.1.1 屏蔽敏感数据 3.1…

基于Matlab高速动车组转臂定位橡胶节点刚度对车辆动力学影响仿真研究

本研究针对高速动车组转臂定位系统中橡胶节点的刚度对车辆动力学性能的影响进行仿真研究。随着高速铁路的发展,动车组的运行稳定性和舒适性成为设计和运营的核心问题,其中,转臂定位系统作为动车组悬挂系统的重要组成部分,其性能对…

并发专题(8)之JUC阻塞容器源码剖析

一、ArrayBlockingQueue源码剖析 ArrayBlockingQueue底层是采用数组实现的一个队列。因为底层是数据,一般被成为有界队列、其阻塞模式是基于ReentrantLock来实现的。 // 存数据操作 add(E),offer(E),put(E),offer(E,time,unit) // add(E):添加…

AI/ML 基础知识与常用术语全解析

目录 一.引言 二.AI/ML 基础知识 1.人工智能(Artificial Intelligence,AI) (1).定义 (2).发展历程 (3).应用领域 2.机器学习(Machine Learning,ML) (1).定义 (2).学习方式 ①.监督学习 ②.无监督…

【WRF-Urban】WPS中有关Urban的变量设置

【WRF-Urban】WPS中有关Urban的变量设置 地理数据源的配置WRF-Urban所需静态地理数据1、LANDUSE:包含城市地表分类的土地利用数据。2、URB_PARAM:城市参数数据集。3、FRC_URB2D:城市覆盖度数据集 WRF默认设置(美国)数据…

NVR录像机汇聚管理EasyNVR多个NVR同时管理基于B/S架构的技术特点与能力应用

EasyNVR视频融合平台基于云边端协同设计,能够轻松接入并管理海量的视频数据。该平台兼容性强、拓展灵活,提供了视频监控直播、录像存储、云存储服务、回放检索以及平台级联等一系列功能。B/S架构使得EasyNVR实现了视频监控的多元化兼容与高效管理。 其采…

c++预编译头文件

文章目录 c预编译头文件1.使用g编译预编译头文件2.使用visual studio进行预编译头文件2.1visual studio如何设置输出预处理文件(.i文件)2.2visual studio 如何设置预编译(初始创建空项目的情况下)2.3 visual studio打开输出编译时…

Zookeeper的通知机制是什么?

大家好,我是锋哥。今天分享关于【Zookeeper的通知机制是什么?】面试题。希望对大家有帮助; Zookeeper的通知机制是什么? 1000道 互联网大厂Java工程师 精选面试题-Java资源分享网 Zookeeper的通知机制主要通过Watcher实现,它是Zookeeper客…

基于Pyside6开发一个通用的在线升级工具

UI main.ui <?xml version"1.0" encoding"UTF-8"?> <ui version"4.0"><class>MainWindow</class><widget class"QMainWindow" name"MainWindow"><property name"geometry"&…

开源 - Ideal库 - Excel帮助类,ExcelHelper实现(四)

书接上回&#xff0c;前面章节已经实现Excel帮助类的第一步TableHeper的对象集合与DataTable相互转换功能&#xff0c;今天实现进入其第二步的核心功能ExcelHelper实现。 01、接口设计 下面我们根据第一章中讲解的核心设计思路&#xff0c;先进行接口设计&#xff0c;确定Exce…

嵌入式系统应用-LVGL的应用-平衡球游戏 part1

平衡球游戏 part1 1 平衡球游戏的界面设计2 界面设计2.1 背景设计2.2 球的设计2.3 移动球的坐标2.4 用鼠标移动这个球2.5 增加边框规则2.6 效果图2.7 游戏失败重启游戏 3 为小球增加增加动画效果3.1 增加移动效果代码3.2 具体效果图片 平衡球游戏 part2 第二部分文章在这里 1 …

《Python基础》之Pandas库

目录 一、简介 二、Pandas的核心数据结构 1、Series 2、DataFrame 三、数据读取与写入 1、数据读取 2、数据写入 四、数据清洗与处理 1、处理缺失值 2、处理重复值 3、数据转换 五、数据分析与可视化 1、统计描述 2、分组聚合 3、数据可视化 六、高级技巧 1、时…

网络安全-夜神模拟器如何通过虚拟机的Burp Suite代理应用程序接口

第一步、查看虚拟机的IP地址 我们可以通过ifconfig命令来查看虚拟机的IP地址,如下图所示。 第二步、在Burp Suite上设置代理 打开虚拟机上的Burp Suite,进入到代理模块中,进入到代理设置中心 打开系统代理设置中心之后,将我们虚拟机的地址添加到上面,作为新的代理。 第…

PyTorch 2.5.1: Bugs修复版发布

一&#xff0c;前言 在深度学习框架的不断迭代中&#xff0c;PyTorch 社区始终致力于提供更稳定、更高效的工具。最近&#xff0c;PyTorch 2.5.1 版本正式发布&#xff0c;这个版本主要针对 2.5.0 中发现的问题进行了修复&#xff0c;以提升用户体验。 二&#xff0c;PyTorch 2…

SpringAi整合大模型(进阶版)

进阶版是在基础的对话版之上进行新增功能。 如果还没弄出基础版的&#xff0c;请参考 https://blog.csdn.net/weixin_54925172/article/details/144143523?sharetypeblogdetail&sharerId144143523&sharereferPC&sharesourceweixin_54925172&spm1011.2480.30…

Python实现网站资源批量下载【可转成exe程序运行】

Python实现网站资源批量下载【可转成exe程序运行】 背景介绍解决方案转为exe可执行程序简单点说详细了解下 声明 背景介绍 发现 宣讲家网 的PPT很好&#xff0c;作为学习资料使用很有价值&#xff0c;所以想下载网站的PPT课件到本地&#xff0c;但是由于网站限制&#xff0c;一…

CSS函数

目录 一、背景 二、函数的概念 1. var()函数 2、calc()函数 三、总结 一、背景 今天我们就来说一说&#xff0c;常用的两个css自定义属性&#xff0c;也称为css函数。本文中就成为css函数。先来看一下官方对其的定义。 自定义属性&#xff08;有时候也被称作CSS 变量或者级…