vue3+vite 部署npm 包
公司需要所以研究了一下怎么部署安装,比较简单
先下载个vue项目
不用安准路由,pinna 啥的,只需要一个最简单的模版
删掉App.vue 中的其它组件
npm create vue@latest
开始写自定义组件

新建一个el-text 组件, name是重点,vue3中也得这么导出name属性
<script>
export default {name: 'elText',
}
</script>
<template><div>我是一个text组件{{ title }}<button @click="handleClick">按钮</button></div>
</template>
<script setup>
import {ref} from 'vue'
let title = ref('123')
let handleClick = () => {title.value = '我的test'
}
</script>
新建index.js 导出自己写的组件
import elText from './el-text.vue'const comment = [elText]const install = function (App) {comment.forEach((item) => {App.component(item.name, item)})
}
// 判断是否直接引入文件,如果是,就不用调用Vue.use()
if (typeof window !== 'undefined' && window.Vue) {install(window.Vue)
}
export default install
测试自己写的组件有没有问题


vite 打包配置
name 名自己起就行了
import {fileURLToPath, URL} from 'node:url'import {defineConfig} from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'node:path'// https://vite.dev/config/
export default defineConfig({plugins: [vue()],resolve: {alias: {'@': fileURLToPath(new URL('./src', import.meta.url)),},},build: {lib: {entry: path.resolve(__dirname, './src/components/index.js'),name: 'smart-process',fileName: 'process',},rollupOptions: {external: ['vue'],output: {globals: {vue: 'Vue',},},},},
})
配置完成后执行 npm run build
配置package.json
privite 必须是false,文件地址也要写对
npm 发布
npm 网址
前提: npm 代理地址要用 npm(官方镜像)
npm login
// 登录成功后
npm publish

使用
新建一个vue项目
npm i smart-process
引入我自己部署的插件并使用
这里直接使用在smart-process 中开发的el-text组件
效果图

相关文章:
vue3+vite 部署npm 包
公司需要所以研究了一下怎么部署安装,比较简单 先下载个vue项目 不用安准路由,pinna 啥的,只需要一个最简单的模版 删掉App.vue 中的其它组件 npm create vuelatest 开始写自定义组件 新建一个el-text 组件, name是重点,vue3中…...
华为鸿蒙HarmonyOS应用开发者高级认证视频及题库答案
华为鸿蒙开发者高级认证的学习资料 1、课程内容涵盖HarmonyOS系统介绍、DevEco Studio工具使用、UI设计与开发、Ability设计与开发、分布式特性、原子化服务卡片以及应用发布等。每个实验都与课程相匹配,帮助加深理解并掌握技能 2、学习视频资料 华为HarmonyOS开发…...
【计网】从零开始认识IP协议 --- 认识网络层,认识IP报头结构
从零开始认识IP协议 1 网络层协议1.1 初步认识IP协议1.2 初步理解IP地址 2 IP协议报头3 初步理解网段划分 1 网络层协议 1.1 初步认识IP协议 我们已经熟悉了传输层中的UDP和TCP协议,接下来我们来接触网络层的协议: 网络层在计算机网络中的意义主要体现…...
大一物联网要不要转专业,转不了该怎么办?
有幸在2014年,踩中了物联网的风口,坏消息,牛马的我,一口汤都没喝上。 依稀记得,当时市场部老大,带我去上海参加电子展会,印象最深的,一些物联网云平台,靠着一份精美PPT&a…...
LeetCode题练习与总结:4的幂--342
一、题目描述 给定一个整数,写一个函数来判断它是否是 4 的幂次方。如果是,返回 true ;否则,返回 false 。 整数 n 是 4 的幂次方需满足:存在整数 x 使得 n 4^x 示例 1: 输入:n 16 输出&am…...
ubuntu GLEW could not be initialized : Unknown error
原因 某些ubuntu版本默认使用wayland协议,glew不支持 解决方法 1、编辑GDM3配置文件 sudo nano /etc/gdm3/custom.conf 2、修改配置文件 去掉#WaylandEnablefalse前的# 3、重启GDM3服务 sudo systemctl restart gdm3 修改后默认使用X11协议。...
51c~目标检测~合集1
我自己的原文哦~ https://blog.51cto.com/whaosoft/12371248 #目标检测x1 又一个发现 都不知道是第几了 是一个高效的目标检测 动态候选较大程度提升检测精度 目标检测是一项基本的计算机视觉任务,用于对给定图像中的目标进行定位和分类。 论文地址:…...
前端工程化面试题
说一下模块化方案 模块化是为了解决代码的复用和组织问题,可以说有了模块化才让前端有了工程的概念,模块化要解决两大问题 代码隔离和依赖管理,从node.js最早发布的commonjs 到浏览器端的 AMD,CMD 规范以及兼容的 UMD 规范,再到现…...
【Visual Studio】下载安装 Visual Studio Community 并配置 C++ 桌面开发环境的图文教程
引言 Visual Studio 是一个面向 .NET 和 C 开发人员的综合性 Windows 版 IDE,可用于构建 Web、云、桌面、移动应用、服务和游戏。 安装步骤 访问 Visual Studio 的官方下载页面: https://visualstudio.microsoft.com/zh-hans/downloads/运行已下载的 V…...
010Editor:十六进制编辑器
介绍 世界上最好的十六进制编辑器和出色的文本编辑器 010 Editor 是用于处理文本和二进制数据的终极工具包。 添加模板 模板库https://www.sweetscape.com/010editor/repository/templates/ 先下载一个ELF 模板 运行模板...
Vscode中Github Copilot无法使用
现象 Copilot侧边栏显示要登录,但是点击"github登录"没有反应与Copilot对话,报错如下: Unexpected token o, "[object Rea"... is not valid JSON解决方案 在网上怎么找都没找到类似的问题,最后发现是Vsco…...
<项目代码>YOLOv8表情识别<目标检测>
YOLOv8是一种单阶段(one-stage)检测算法,它将目标检测问题转化为一个回归问题,能够在一次前向传播过程中同时完成目标的分类和定位任务。相较于两阶段检测算法(如Faster R-CNN),YOLOv8具有更高的…...
利用Msfvenom实现对Windows的远程控制
1.实验准备 kali安装 Apache2(如果尚未安装): sudo apt install apache2 启动 Apache2 服务: sudo systemctl start apache2确认 Apache2 的默认网页可以访问: 打开浏览器并访问 http://<你的Kali IP>ÿ…...
Java Iterator和for区别详解和常见问题及解决方式
在 Java 中,Iterator 是一个用于遍历集合元素的接口。它为访问集合中的元素提供了一种标准的方法,不管具体集合的实现如何。本文将详细讲解 Iterator 的使用、其与 for 循环的区别,以及在遍历集合时的删除操作可能带来的问题,并提…...
川渝地区软件工程考研择校分析
C哥专业提供——计软考研院校选择分析专业课备考指南规划 通过最新数据分析,5所高校软件工程专业2025年考研难度从高到低预计为: 电子科技大学 >> 四川大学 > 重庆大学 ≈ 西南交通大学 > 西南大学 对于想考川渝地区985但核心目标为优先上岸的考生,建议重点考虑西…...
快捷键记忆
快捷键记忆 文章目录 快捷键记忆前言一、PotPlayer快捷键二、电脑快捷键总结 前言 提示:以下是本篇文章正文内容: 一些软件的快捷键经常忘记,写这篇文章的目的是帮助我忘记的时候来查看。 顺序实时更新: 一、PotPlayer快捷键 Po…...
Flutter鸿蒙next 状态管理高级使用:深入探讨 Provider
✅近期推荐:求职神器 https://bbs.csdn.net/topics/619384540 🔥欢迎大家订阅系列专栏:flutter_鸿蒙next 💬淼学派语录:只有不断的否认自己和肯定自己,才能走出弯曲不平的泥泞路,因为平坦的大路…...
JMeter实战之——模拟登录
本篇介绍使用JMeter 如何对需要登录的站点进行压力测试。 基本Session验证的机制 使用session进行请求验证的机制是一种常见的Web应用认证方式。 该认证方式的主要内容如下: 一、登录过程 用户输入:用户在登录页面输入用户名和密码。发送请求&#x…...
智能台灯设计(一)原理图设计
1. 前言 作者最近突发奇想,想自己做一个小台灯,设想的功能有:带锂电池可充电、可以调节亮度,后续通过增加WIFI模块实现手机控制开关功能。目前先实现最简单的功能,有时间再一步步完善吧。 2. 原理图设计 充电芯片使用…...
数据库查询返回结果集及其元数据信息:ResultSet 和 ResultSetMetaData 深度解析
全文目录: 开篇语📌 目录🌟 前言📝 摘要📚 简介🔍 概述🧩 核心源码解读1️⃣ 创建数据库连接2️⃣ 执行查询获取结果集3️⃣ 读取查询数据4️⃣ 获取元数据信息 💻 案例分析…...
UOS系统下WPS卸载不干净?手把手教你用命令行精准清理(附dpkg/apt组合拳)
UOS系统下WPS卸载不干净?手把手教你用命令行精准清理 在UOS系统日常使用中,WPS Office作为常用办公软件,有时因版本更新或功能调整需要彻底卸载。但不少用户发现,通过图形界面或简单命令卸载后,系统中仍残留配置文件、…...
2026年,揭秘那些真正安全的原生态食材厂家你不可不知的秘密
随着人们生活水平的提升以及对健康的日益重视,选择真正安全的原生态食材已经成为许多人购买食物的标准。但市场的繁杂使得甄别真正安全的食材厂家变得愈加困难。今天,我将通过几个关键角度,为大家揭秘那些真正安全的原生态食材厂家的秘密&…...
2026上半年数据库系统工程师(软考)上午题回忆与解析(非标答版)
本文为考后回忆整理,非官方标准答案,旨在为考后对答案及下半年备考的同学提供参考。题目顺序和表述可能与原卷有出入,欢迎在评论区指正、补充。📊 整体考情分析 刚结束的2026年上半年数据库系统工程师考试,上午题的风格…...
【DeepSeek事件驱动架构实战指南】:20年架构师亲授5大核心陷阱与避坑清单
更多请点击: https://kaifayun.com 第一章:DeepSeek事件驱动架构全景认知 DeepSeek事件驱动架构(Event-Driven Architecture, EDA)并非单一技术组件的堆叠,而是一种以事件为第一公民、强调松耦合与异步协作的系统设计…...
神经网络与深度学习 第3周课程总结
深度学习视觉应用课程总结 一、常用计算机视觉数据集数据集名称发布方/年份规模图像规格类别数主要用途核心特点MNIST美国国家标准与技术研究院60k训练10k测试2828灰度图10类(0-9手写数字)入门级图像分类最经典的手写数字识别基准数据集Fashion-MNISTZalando(2017)60k训练10k测…...
基于PIC32的嵌入式MIDI合成器:从波表合成到硬件实现
1. 项目概述:一个基于嵌入式微控制器的MIDI声音合成器如果你对电子音乐制作、嵌入式开发,或者DIY硬件合成器感兴趣,那么“REMI Synth”这个项目绝对值得你花时间深入了解。它本质上是一个数字单音MIDI控制的声音合成器,核心是一块…...
Java项目中如何提升整体系统性能?
性能优化可以说是我们程序员的必修课,如果你想要跳出CRUD的苦海,成为一个更“高级”的程序员的话,性能优化这一关你是无论无何都要去面对的。为了提升系统性能,开发人员可以从系统的各个角度和层次对系统进行优化。除了最常见的代…...
claude code用户如何迁移到taotoken解决封号与token不足问题
🚀 告别海外账号与网络限制!稳定直连全球优质大模型,限时半价接入中。 👉 点击领取海量免费额度 Claude Code 用户如何迁移到 Taotoken 解决封号与 Token 不足问题 应用场景类,针对 Claude Code 用户常遇封号与 Token…...
基于晶体管逻辑的水箱自动控制器设计与实现
1. 项目概述:一个基于晶体管逻辑的自动水箱/湿度灌溉控制器 如果你也像我一样,曾经为家里的花园、阳台植物或者农村老家的储水塔手动开关水泵而烦恼,那么这个项目就是为你准备的。我设计并制作了一个完全自动化的水箱水位控制器,它…...
如何用免费工具解锁QQ音乐、网易云音乐等加密格式:3分钟解决音乐播放限制
如何用免费工具解锁QQ音乐、网易云音乐等加密格式:3分钟解决音乐播放限制 【免费下载链接】unlock-music 在浏览器中解锁加密的音乐文件。原仓库: 1. https://github.com/unlock-music/unlock-music ;2. https://git.unlock-music.dev/um/web…...




