如何使用Vite创建vue项目中配置别名和扩展名

vite.config.js中,resolve 用于配置模块解析规则,如设置别名、扩展名等。

import {defineConfig} from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path';

export default defineConfig({
	resolve: {
		// 别名配置
	    alias: {
	    	// 将 '@' 指向根目录下的 'src' 目录
	      '@': path.resolve(__dirname, 'src'),
	    },
	    // 自动解析的扩展名
	    extensions: ['.js', '.vue'],
	    // 是否严格遵循 `node_modules` 中的 `package.json` 中的 `main` 字段
	    dedupe: [],
	    // 是否尝试将绝对路径的导入转换为相对路径(仅适用于 CommonJS 模块)
		optimizeDeps: {
			// 预构建依赖列表,提高启动速度
			include: ['vue', 'vue-router'],
			// 排除预构建的依赖
			exclude: [],
		},
	},
})

配置各部分的解释:

  • alias
    通过定义别名,可以在导入语句中使用简短的别名代替长路径,提高代码可读性和可维护性。

  • extensions
    指定在导入语句省略文件扩展名,Vite 会自动尝试添加并查找这些扩展名。这样可以避免在导入语句中显式写出扩展名。

  • dedupe
    用于解决依赖包重复的问题。如果一个库被多个依赖间接重复引入,Vite 会尝试将其合并为一个。

  • optimizeDeps
    include: 列出需要在服务启动时预构建的依赖,以提高应用启动速度。
    exclude: 列出不需要预构建的依赖,通常用于那些需要动态加载或有特殊处理需求的库。

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

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

相关文章

Quarto Dashboards 教程 3:Dashboard Data Display

「写在前面」 学习一个软件最好的方法就是啃它的官方文档。本着自己学习、分享他人的态度,分享官方文档的中文教程。软件可能随时更新,建议配合官方文档一起阅读。推荐先按顺序阅读往期内容: 1.quarto 教程 1:Hello, Quarto 2.qu…

耐酸碱腐蚀PFA冷凝回流装置进口透明聚四氟材质PFA梨形漏斗特氟龙圆底烧瓶

PFA分液漏斗:也叫特氟龙分液漏斗、特氟龙梨型分液漏斗。 规格参考:125ml、250ml、500ml、1000ml 其主要特性有: 1.内壁对溶剂无粘贴性和吸附,可完全排空,分界面清晰可见; 2.密封性好,可防止…

excel文件导入dbeaver中文乱码

1.将excel文件进行另存为,保存类型选择【CSV】 2.选择【工具】–>【web选项】–> 【编码】–> 【简体中文(GB18030)】 3.在DBeaver进行数据导入 直接导入应该就可以,如果不行的话按下面处理。 选择【导入数据——选择cs…

云原生Kubernetes: K8S 1.29版本 部署Nexus

目录 一、实验 1.环境 2.搭建NFS 3. K8S 1.29版本 部署Nexus 二、问题 1.volumeMode有哪几种模式 一、实验 1.环境 (1)主机 表1 主机 主机架构版本IP备注masterK8S master节点1.29.0192.168.204.8 node1K8S node节点1.29.0192.168.204.9node2K…

Java毕业设计 基于SpringBoot vue养老院管理系统 微信小程序

Java毕业设计 基于SpringBoot vue养老院管理系统 微信小程序 SpringBoot 养老院管理系统 功能介绍 小程序 护工登录注册 忘记密码 护工信息维护 首页 图片轮播 床位调动申请 床位展示 床位详情 床位分配 房间展示 公告信息 公告详情 健康信息 请假申请 离职申请 后台管理 登…

09.JAVAEE之网络初识

1.网络 单机时代 >局域网时代 >广域网时代 >移动互联网时代 1.1 局域网LAN 局域网,即 Local Area Network,简称LAN。 Local 即标识了局域网是本地,局部组建的一种私有网络。 局域网内的主机之间能方便的进行网络通信&#xff0…

有哪些人工智能/数据分析领域可以考取的证书?

一、TensorFlow谷歌开发者认证 TensorFlow面向学生、开发者、数据科学家等人群,帮助他们展示自己在用 TensorFlow 构建、训练模型的过程中所学到的实用机器学习技能。 添加图片注释,不超过 140 字(可选) TensorFlow 的产品总监 …

抖音智能运营系统源码

这是一个一站式服务的抖音智能运营系统,旨在提升内容创作者和营销人员的工作效率。它是一个综合性的在线服务平台,专为抖音内容创作者和营销人员设计。系统基于高性能、可扩展性强的ThinkPHP框架,整合了视频处理、数据分析、文案生成与配音等…

Redis网络部分相关的结构体2 和 绑定回调函数细节

目录 1. struct connection ConnectionType属性 创建connection 2. struct client 3. 绑定客户端回调函数的流程 3.1. 读事件回调函数的设置 3.2. 写事件回调函数的设置 3.3. connSocketEventHandler函数 3.4. Redis5版本的设置回调函数 3.5. 个人的一些想法&#xf…

2024贵州康博会|特色健康食品展|医药展|医疗器械展会

2024 中国(贵州)大健康产业博览会2024 特色食品(农产品、水、饮料)暨第22届医药及医疗器械、设备展览会邀请函 时间:2024 年 9 月 26 日 -28 日(共三天) 地点:贵阳国际会议展览中心 (观山湖区) 主办单位: 贵州省天然饮用水行业协会 贵州省大健康产业…

diskMirror docker 使用容器部署 diskMirror 服务器!!!

Welcome to diskMirror-docker 获取项目 这个项目是 diskMirror-spring-boot 镜像版本的项目,您可以使用下面的命令将此项目编译为一个镜像! # 进入到您下载的源码包目录 cd diskMirror-docker# 点击脚本来进行版本的设置以及对应版本的下载 设置 和 编…

FastGPT编译前端界面,并将前端界面映射到Docker容器中

建议在linux系统下编译 1、克隆代码 git clone https://github.com/labring/FastGPT 2、进入FastGPT目录,执行 npm install 3、进入projects/app目录,执行 npm run dev 此时会自动下载依赖包,这里如果执行npm install的话,…

IDEA2024最新版的激活与安装-保姆级教学

目录 一、idea 介绍 二、官网下载 2.1 进入官网,下载zip绿色版即可 2.2 输入网址下载jetbra.zip 2.3 执行idea/soft/scripts/install-allusers.vbs文件(根据自己安装路径改变) 2.4 启动idea/soft/bin/idea64.exe 将事先复制好的码复制进去…

MATLAB线性函数拟合并预测

线性函数拟合,由线性函数很好描述的一个数集,也就是说如果我们所考虑的数据是以y(x)的形式给出,并且其中f(x)满足: 要求得 m 和b的值,我们可以使用一个称为 polyii(x,y,n)的 MATLAB 函数,其中n是我们要 MATLAB 求出的多项式的次数…

Ribbon负载均衡的两种方案

1.服务端负载均衡 在消费者和服务提供方中间使用独立的代理方式进行负载,有硬件的(比如 F5),也有软件的(比如 Nginx,openResty) 例如Nginx,通过Nginx进行负载均衡,先发送…

李沐66_使用注意力机制的seq2seq——自学笔记

加入注意力 1.编码器对每次词的输出作为key和value 2.解码器RNN对上一个词的输出是query 3.注意力的输出和下一个词的词嵌入合并进入RNN 一个带有Bahdanau注意力的循环神经网络编码器-解码器模型 总结 1.seq2seq通过隐状态在编码器和解码器中传递信息 2.注意力机制可以根…

.NET 个人博客-添加RSS订阅功能

个人博客-添加RSS订阅功能 前言 个人博客系列已经完成了 留言板文章归档推荐文章优化推荐文章排序 博客地址 然后博客开源的原作者也是百忙之中添加了一个名为RSS订阅的功能,那么我就来简述一下这个功能是干嘛的,然后照葫芦画瓢实现一下。 RSS简述…

php代码比对工具优化版

下载地址:php代码比对工具优化版.zip 一款强大且专业的文件对比工具(php代码比对),用户可以直接在线进行两个或多个文件的差异对比,支持用户进行多种格式的问价对比,用户可以在这里轻松查找出相同会不同之处,支持用户…

elementui el-date-picker禁止选择今年、今天、之前、时间范围限制18个月

1、禁止选择今年之前的所有年份 <el-date-pickerv-if"tabsActive 0":clearable"false"v-model"yearValue"change"yearTimeChange"type"year"placeholder"选择年"value-format"yyyy":picker-options…

文化旅游3D数字孪生可视化管理平台推动文旅产业迈向更加美好的未来

随着数字化、智能化管理成为文旅产业发展的必然趋势&#xff0c;数字孪生公司深圳华锐视点创新性地推出了景区三维可视化数字孪生平台&#xff0c;将线下的实体景区与线上的虚拟世界完美融合&#xff0c;引领智慧文旅新潮流。 我们运用先进的数字孪生、web3D开发和三维可视化等…