手搓vue3组件_0,打包配置
打包后引入项目是发现报错:
Cannot read properties of null (reading 'isCE')
TypeError: Cannot read properties of null (reading 'isCE')
这个是由于vue版本冲突问题,
这里我引入了自己打包的ui组件库,但是ui组件库中打包进入了自己的vue,那么在此时使用时,如果你引入的自己的组件中有slot,那么就会包这个问题,
解决方法千奇百怪
我的解决:
vue.config.js中加上:
resolve: {symlinks: false,alias: {vue: path.resolve('./node_modules/vue')}},
那么它的完整配置就是:
const { defineConfig } = require('@vue/cli-service')
// const webpack = require("webpack");
//打包配置自动忽略console.log等
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
const path = require('path')module.exports = defineConfig({productionSourceMap: false,transpileDependencies: true,publicPath: '/',//代理devServer: {// 指定项目启动时的默认端口号port: 80,historyApiFallback: true,allowedHosts: 'all',proxy: {'/': {ws: false,target: "http://localhost:89",changeOrigin: true,pathRewrite: {'^/': '/'}}},// proxy: 'http://localhost:8090'},configureWebpack: {resolve: {symlinks: false,alias: {vue: path.resolve('./node_modules/vue')}},plugins: [//打包环境去掉console.log等/* @author icestone , 17:22* @date 2023/5/15* 下面这个应该在打包时才打开,开发时不要打开,编译消耗很多时间*//*new UglifyJsPlugin({uglifyOptions: {compress: {//warnings: false, 注释不然打包会报错如图下图drop_console: true, //注释consoledrop_debugger: true, //注释debuggerpure_funcs: ['console.log'], //移除console.log},},})*/],output: {libraryExport: '../behind/src/static'},},
})
- 当然,上面是在vue cli项目中的解决
关于这段配置的解释:
这段代码是用于配置 Webpack 的,它的目的是为了设置项目的别名和禁用符号链接。resolve.symlinks: false:这一行设置为 false 表示禁用符号链接。符号链接是一种特殊的文件链接,它允许一个文件或目录链接到另一个文件或目录。在某些情况下,符号链接可能会导致问题,因此将其设置为 false 是合适的。resolve.alias: { vue: path.resolve('./node_modules/vue') }:这一行设置了一个别名,它的作用是将 vue 模块解析为 ./node_modules/vue。这样,Webpack 就可以找到 Vue.js 库的入口文件,并且不会出现找不到模块的情况。path.resolve('./node_modules/vue') 是一个计算属性,它将当前项目的根路径与 vue 模块的路径进行拼接,得到 Vue.js 模块的完整路径。总之,这段代码的作用是配置 Webpack 以禁用符号链接并设置 Vue.js 模块的别名。
- 在vite项目中也是这样解决的,显式声明使用的vue位置:
import { defineConfig } from 'vite'
import path from 'path'
import vue from '@vitejs/plugin-vue'// https://vitejs.dev/config/
export default defineConfig({plugins: [vue()],resolve: {alias: {'@': path.resolve(__dirname, 'src'),vue: path.resolve('./node_modules/vue')}},css: {// 预处理器配置项preprocessorOptions: {less: {math: "always",},},},server: {proxy: {// 正则表达式写法'/api': {target: 'http://localhost:89',changeOrigin: true,rewrite: (path) => path.replace(/^\/api/, '')}}}
})
相关文章:
手搓vue3组件_0,打包配置
打包后引入项目是发现报错: Cannot read properties of null (reading isCE) TypeError: Cannot read properties of null (reading isCE)这个是由于vue版本冲突问题, 这里我引入了自己打包的ui组件库,但是ui组件库中打包进入了自己的vue,那么在此时使用时,如果你引入的自己的组…...
WebAssembly
WebAssembly(简称Wasm)是一种面向Web的二进制指令格式,用于在现代Web浏览器中运行高性能的可移植代码。它是一种跨平台、低级别的虚拟机技术,允许开发者将不同编程语言的代码编译成Wasm格式,然后在Web浏览器中运行。 …...
TM4C123库函数学习(2)--- LED闪烁,滴答定时器精准延时
前言 (1)阅读本文之前,需要先看TM4C123库函数学习(1)— 点亮LEDTM4C123的ROM函数简介keil开发环境搭建篇。 (2)TM4C123是M4的内核,拥有一个24位向下计数的SysTick定时器。࿰…...
Linux: network: tcp: back-off技术
当一个包需要重传的时候,会使用 exponential back-off来计算下一次重传的时间。 这个back-off的使用还是相当的广泛:《Adaptive Backoff Synchronization Technique》https://dl.acm.org/doi/pdf/10.1145/74926.74970 The general idea of backoff has …...
36 | 银行贷款数据分析
本文将以银行贷款数据分析为主题,深入探讨如何运用数据科学的方法,揭示银行贷款领域的内在规律和趋势。通过对贷款数据的分析,我们能够洞察不同类型贷款的分布情况、贷款金额的变化趋势,以及借款人的特征和还款情况等关键信息。 通过运用Python编程语言及相关的数据分析工…...
计算机网络-物理层(二)- 传输方式
计算机网络-物理层(二)- 传输方式 串型传输与并行传输 串行传输:是指数据是一个比特一个比特依次发送的,因此在发送端和接收端之间,只需要一条数据传输线路即可 并行传输:是指一次发送n个比特而不是一个比特,因此发送…...
超强台风“杜苏芮”来袭!如何实现安全可靠的通信?
暴雨来袭 超强台风“杜苏芮”是2023年太平洋台风季第5个被命名的台风,在我国东南沿海地区造成了巨大的影响,在7月28日登录福建省晋江市时,“杜苏芮”中心附近最大风力15级,达到了超强台风的等级;福州市区、闽侯、莆田…...
内网隧道—HTTP\DNS\ICMP
本文仅限于安全研究和学习,用户承担因使用此工具而导致的所有法律和相关责任! 作者不承担任何法律和相关责任! HTTP隧道 Neo-reGeorg Neo-reGeorg 是一个旨在积极重构 reGeorg 的项目,目的是: 提高可用性࿰…...
QT mouseTracking
在Qt中要捕捉鼠标移动事件需要重写MouseMoveEvent,但是MouseMoveEvent为了不太耗资源在默认状态下是要鼠标按下才能捕捉到。要想鼠标不按下时的移动也能捕捉到,需要setMouseTracking(true)。 如果鼠标跟踪失效(默认),…...
java操作mongdb【超详细】
Java操作 搭建 搭建 依赖 <!--mongodb--><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-mongodb</artifactId></dependency>配置文件 spring:data:mongodb:host…...
JavaScript函数
什么是函数? 在 JavaScript 中,函数是一段被封装起来用于特定任务的可重复使用的代码块。 例如: function logger() {console.log(IT知识一享); }这样就创造了logger()函数,后续可以重复利用这个函数让它输出日志,后…...
RISC-V公测平台发布 · 使用YCSB测试SG2042上的MySQL性能
实验介绍: YCSB(全称为Yahoo! Cloud Serving Benchmark),该性能测试工具由Java语言编写(在之前的MC文章中也提到过这个,如果没看过的读者可以去看看之前MC那一期),主要用于云端或者…...
母婴即时零售行业数据可视化分析
对新晋父母来说,很多母婴用品如同一位贴心的助手,为他们的宝宝提供温暖和呵护。从婴儿床垫到可爱的拼图玩具,每一件用品都是为宝宝的成长和发展量身定制。对于繁忙的父母们而言,这些用品不仅帮助照顾孩子,更是为他们减…...
快速解决IDEA中类的图标变成J,不是C的情况
有时候导入新的项目后,会出现如下情况,类的图标变成J,如图: 直接上解决方法: 找到项目的pom.xml,右键,在靠近最下方的位置找到Add as Maven Project,点击即可。 此时,一般类的图标就…...
vue学习笔记
1.官网 v2官网 https://v2.cn.vuejs.org/ v3官网 https://cn.vuejs.org/ 2.vue引入 在线引入 <script src"https://cdn.jsdelivr.net/npm/vue2.7.14/dist/vue.js"></script> 下载引入(下载链接) https://v2.cn.vuejs.org/js/vue.js 3.初始化渲…...
难解的bug
android.app.RemoteServiceException: Context.startForegroundService() did not then call Service.startForeground(): ServiceRecord 【Android TimeCat】 解决 context.startforegroundservice() did not then call service.startforeground() | XiChens Blog http://www…...
人文景区有必要做VR云游吗?如何满足游客出行需求?
VR云游在旅游行业中的应用正在快速增长,为游客带来沉浸式体验的同时,也为文旅景区提供了新的营销方式。很多人说VR全景展示是虚假的,比不上真实的景区触感,人文景区真的有必要做VR云游吗?我的答案是很有必要。 如果你认…...
【字节跳动青训营】后端笔记整理-1 | Go语言入门指南:基础语法和常用特性解析
**本人是第六届字节跳动青训营(后端组)的成员。本文由博主本人整理自该营的日常学习实践,首发于稀土掘金:🔗Go语言入门指南:基础语法和常用特性解析 | 青训营 本文主要梳理自第六届字节跳动青训营ÿ…...
3.解构赋值
解构赋值是一种快速为变量赋值的简洁语法,本质上仍然是为变量赋值。 3.1数组解构 数组解构是 将数组的单元值快速批量赋值给一系列变量 的简洁语法 1.基本语法: (1)赋值运算符左侧的[ ]用于批量声明变量,右侧数组的单元值将被赋…...
ChatGPT在智能游戏和游戏AI中的应用如何?
ChatGPT在智能游戏和游戏AI领域具有广泛的应用潜力,可以为游戏体验增添智能和交互性,同时也有助于游戏开发者创造更丰富、更引人入胜的游戏内容。以下将详细探讨ChatGPT在智能游戏和游戏AI中的应用。 ## 1. 游戏角色的智能化 在角色扮演游戏࿰…...
web vue 项目 Docker化部署
Web 项目 Docker 化部署详细教程 目录 Web 项目 Docker 化部署概述Dockerfile 详解 构建阶段生产阶段 构建和运行 Docker 镜像 1. Web 项目 Docker 化部署概述 Docker 化部署的主要步骤分为以下几个阶段: 构建阶段(Build Stage):…...
python/java环境配置
环境变量放一起 python: 1.首先下载Python Python下载地址:Download Python | Python.org downloads ---windows -- 64 2.安装Python 下面两个,然后自定义,全选 可以把前4个选上 3.环境配置 1)搜高级系统设置 2…...
让回归模型不再被异常值“带跑偏“,MSE和Cauchy损失函数在噪声数据环境下的实战对比
在机器学习的回归分析中,损失函数的选择对模型性能具有决定性影响。均方误差(MSE)作为经典的损失函数,在处理干净数据时表现优异,但在面对包含异常值的噪声数据时,其对大误差的二次惩罚机制往往导致模型参数…...
Vite中定义@软链接
在webpack中可以直接通过符号表示src路径,但是vite中默认不可以。 如何实现: vite中提供了resolve.alias:通过别名在指向一个具体的路径 在vite.config.js中 import { join } from pathexport default defineConfig({plugins: [vue()],//…...
【Veristand】Veristand环境安装教程-Linux RT / Windows
首先声明,此教程是针对Simulink编译模型并导入Veristand中编写的,同时需要注意的是老用户编译可能用的是Veristand Model Framework,那个是历史版本,且NI不会再维护,新版本编译支持为VeriStand Model Generation Suppo…...
向量几何的二元性:叉乘模长与内积投影的深层联系
在数学与物理的空间世界中,向量运算构成了理解几何结构的基石。叉乘(外积)与点积(内积)作为向量代数的两大支柱,表面上呈现出截然不同的几何意义与代数形式,却在深层次上揭示了向量间相互作用的…...
FTXUI::Dom 模块
DOM 模块定义了分层的 FTXUI::Element 树,可用于构建复杂的终端界面,支持响应终端尺寸变化。 namespace ftxui {...// 定义文档 定义布局盒子 Element document vbox({// 设置文本 设置加粗 设置文本颜色text("The window") | bold | color(…...
深入浅出JavaScript中的ArrayBuffer:二进制数据的“瑞士军刀”
深入浅出JavaScript中的ArrayBuffer:二进制数据的“瑞士军刀” 在JavaScript中,我们经常需要处理文本、数组、对象等数据类型。但当我们需要处理文件上传、图像处理、网络通信等场景时,单纯依赖字符串或数组就显得力不从心了。这时ÿ…...
ffmpeg(三):处理原始数据命令
FFmpeg 可以直接处理原始音频和视频数据(Raw PCM、YUV 等),常见场景包括: 将原始 YUV 图像编码为 H.264 视频将 PCM 音频编码为 AAC 或 MP3对原始音视频数据进行封装(如封装为 MP4、TS) 处理原始 YUV 视频…...
实现p2p的webrtc-srs版本
1. 基本知识 1.1 webrtc 一、WebRTC的本质:实时通信的“网络协议栈”类比 将WebRTC类比为Linux网络协议栈极具洞察力,二者在架构设计和功能定位上高度相似: 分层协议栈架构 Linux网络协议栈:从底层物理层到应用层(如…...
