手搓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. 游戏角色的智能化 在角色扮演游戏࿰…...
进程地址空间(比特课总结)
一、进程地址空间 1. 环境变量 1 )⽤户级环境变量与系统级环境变量 全局属性:环境变量具有全局属性,会被⼦进程继承。例如当bash启动⼦进程时,环 境变量会⾃动传递给⼦进程。 本地变量限制:本地变量只在当前进程(ba…...
在鸿蒙HarmonyOS 5中实现抖音风格的点赞功能
下面我将详细介绍如何使用HarmonyOS SDK在HarmonyOS 5中实现类似抖音的点赞功能,包括动画效果、数据同步和交互优化。 1. 基础点赞功能实现 1.1 创建数据模型 // VideoModel.ets export class VideoModel {id: string "";title: string ""…...
《Playwright:微软的自动化测试工具详解》
Playwright 简介:声明内容来自网络,将内容拼接整理出来的文档 Playwright 是微软开发的自动化测试工具,支持 Chrome、Firefox、Safari 等主流浏览器,提供多语言 API(Python、JavaScript、Java、.NET)。它的特点包括&a…...
VTK如何让部分单位不可见
最近遇到一个需求,需要让一个vtkDataSet中的部分单元不可见,查阅了一些资料大概有以下几种方式 1.通过颜色映射表来进行,是最正规的做法 vtkNew<vtkLookupTable> lut; //值为0不显示,主要是最后一个参数,透明度…...
HTML前端开发:JavaScript 常用事件详解
作为前端开发的核心,JavaScript 事件是用户与网页交互的基础。以下是常见事件的详细说明和用法示例: 1. onclick - 点击事件 当元素被单击时触发(左键点击) button.onclick function() {alert("按钮被点击了!&…...
汇编常见指令
汇编常见指令 一、数据传送指令 指令功能示例说明MOV数据传送MOV EAX, 10将立即数 10 送入 EAXMOV [EBX], EAX将 EAX 值存入 EBX 指向的内存LEA加载有效地址LEA EAX, [EBX4]将 EBX4 的地址存入 EAX(不访问内存)XCHG交换数据XCHG EAX, EBX交换 EAX 和 EB…...
k8s业务程序联调工具-KtConnect
概述 原理 工具作用是建立了一个从本地到集群的单向VPN,根据VPN原理,打通两个内网必然需要借助一个公共中继节点,ktconnect工具巧妙的利用k8s原生的portforward能力,简化了建立连接的过程,apiserver间接起到了中继节…...
是否存在路径(FIFOBB算法)
题目描述 一个具有 n 个顶点e条边的无向图,该图顶点的编号依次为0到n-1且不存在顶点与自身相连的边。请使用FIFOBB算法编写程序,确定是否存在从顶点 source到顶点 destination的路径。 输入 第一行两个整数,分别表示n 和 e 的值(1…...
【数据分析】R版IntelliGenes用于生物标志物发现的可解释机器学习
禁止商业或二改转载,仅供自学使用,侵权必究,如需截取部分内容请后台联系作者! 文章目录 介绍流程步骤1. 输入数据2. 特征选择3. 模型训练4. I-Genes 评分计算5. 输出结果 IntelliGenesR 安装包1. 特征选择2. 模型训练和评估3. I-Genes 评分计…...
Python ROS2【机器人中间件框架】 简介
销量过万TEEIS德国护膝夏天用薄款 优惠券冠生园 百花蜂蜜428g 挤压瓶纯蜂蜜巨奇严选 鞋子除臭剂360ml 多芬身体磨砂膏280g健70%-75%酒精消毒棉片湿巾1418cm 80片/袋3袋大包清洁食品用消毒 优惠券AIMORNY52朵红玫瑰永生香皂花同城配送非鲜花七夕情人节生日礼物送女友 热卖妙洁棉…...
