Vite 配置别名 vue3 项目
官方文档还是有点难懂,然后点链接找到了 https://github.com/rollup/plugins/tree/master/packages/alias#entries
// rollup.config.js
import alias from '@rollup/plugin-alias';
import resolve from '@rollup/plugin-node-resolve';
const customResolver = resolve({
extensions: ['.mjs', '.js', '.jsx', '.json', '.sass', '.scss']
});
const projectRootDir = path.resolve(__dirname);
export default {
// ...
plugins: [
alias({
entries: [
{
find: 'src',
replacement: path.resolve(projectRootDir, 'src')
// OR place `customResolver` here. See explanation below.
}
],
customResolver
}),
resolve()
]
};
我的写法
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import alias from '@rollup/plugin-alias'
import path from 'path'
const projectRootDir = path.resolve(__dirname);
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
vue(),
alias({
entries:[
{find: '@',replacement: path.resolve(projectRootDir, 'src')}
],
})
],
})
官方文档
【地址】https://vitejs.dev/config/#publicdir

Vite 配置别名 vue3 项目的更多相关文章
- 【Parcel 2 + Vue 3】从0到1搭建一款极快,零配置的Vue3项目构建工具
前言 一周时间,没见了,大家有没有想我啊!哈哈!我知道肯定会有的.言归正传,我们切入正题.上一篇文章中我主要介绍了使用Vite2+Vue3+Ts如何更快的入手项目.那么,今天我将会带领大家认识一个新的 ...
- 快速新建并配置一个eslint+prettier+husky+commitlint+vue3+vite+ts+pnpm的项目
前置准备 一台电脑 vscode pnpm vscode插件:ESLint v2.2.6及以上 vscode插件:Prettier - Code formatter v9.5.0及以上 vscode插 ...
- Vue3.x全家桶+vite+TS-搭建Vue3.x项目
目录 一.搭建基础项目 1.vite创建项目 3.运行项目 2.环境变量设置介绍 vite配置多环境打包 二.配置Router 1.安装路由 2.配置路由 3.引入 三.配置Vuex 1.安装vuex ...
- Vue3.x全家桶+vite+TS-构建Vue3基本框架
目录 一.搭建基础项目 1.vite创建项目 3.运行项目 2.环境变量设置介绍 vite配置多环境打包 二.配置Router 1.安装路由 2.配置路由 3.引入 三.配置Vuex 1.安装vuex ...
- 学习 vue3 第一天 vue3简介,创建vue3项目 Composition Api 初识
前言: 从今天开始来和大家一起学习 vue3 相信大家都不陌生,已经火了一段时间了,但是还是有不少人没有学习,那就跟着六扇老师来简单的入个门 废话不多说,来开始今天的学习 Vue3 简介: 2020年 ...
- Git 基础 —— 安装 配置 别名 对象
Git 基础学习系列 Git 基础 -- 安装 配置 别名 对象 Git 基础 -- 常用命令 Git 基础 -- 常见使用场景 Git基础 -- Github 的使用 Git 安装 Git下载地址 ...
- webpack配置别名alias
在webpack.config.js中,通过设置resolve属性可以配置查找“commonJS/AMD模块”的基路径,也可以设置搜索的模块后缀名,还可以设置别名alias.设置别名可以让后续引用的地 ...
- Vite ❤ Electron——基于Vite搭建Electron+Vue3的开发环境【一】
背景 目前社区两大Vue+Electron的脚手架:electron-vue和vue-cli-plugin-electron-builder, 都有这样那样的问题,且都还不支持Vue3,然而Vue3已 ...
- 从零搭建基于webpack的Electron-Vue3项目(1)——基于webpack的Vue3项目搭建
从零搭建基于webpack的Electron-Vue3项目(1)--基于webpack的Vue3项目搭建 前言 本篇文章内容,主要是基于webpack的Vue3项目开发环境进行搭建,暂时还不涉及到El ...
- Vue3项目搭建规范
Vue3项目搭建规范 一. 代码规范 1.1 集成editorconfig配置 EditorConfig有助于为不同IDE编辑器上维护一致的编码风格 安装插件:EditorConfig for VS ...
随机推荐
- 【Azure 事件中心】 org.slf4j.Logger 收集 Event Hub SDK(Java) 输出日志并以文件形式保存
问题描述 在使用Azure Event Hub的SDK时候,常规情况下,发现示例代码中并没有SDK内部的日志输出.因为在Java项目中,没有添加 SLF4J 依赖,已致于在启动时候有如下提示: SLF ...
- 《吐血整理》高级系列教程-吃透Fiddler抓包教程(34)-Fiddler如何抓取微信小程序的包-上篇
1.简介 有些小伙伴或者是童鞋们说小程序抓不到包,该怎么办了???其实苹果手机如果按照宏哥前边的抓取APP包的设置方式设置好了,应该可以轻松就抓到包了.那么安卓手机小程序就比较困难,不是那么友好了.所 ...
- [leetcode] 713. Subarray Product Less Than K
题目 Given an array of integers nums and an integer k, return the number of contiguous subarrays where ...
- PHPMQTT问题一二三
问题一:PHPMQTT作为客户端订阅超过一定数量的主题后,系统就会报错. 思路:在网上查找原因,失败: 打开调试debug = true ; 结果proc方法中报错: eof receive 问题二: ...
- Docker遇见golang https://www.jianshu.com/p/37693eb8f646
golang logo 在我国古代,传说天庭中有种种天兵天将,有看守四大天门的(docker0网桥),有负责传话的门将(REST API),有负责人间和天界联络的,如财神爷,土地公等(NAT,DNS) ...
- 【云原生 · Kubernetes】kubernetes v1.23.3 二进制部署(三)
5 部署 etcd 集群 etcd 是基于 Raft 的分布式 KV 存储系统,由 CoreOS 开发,常用于服务发现.共享配置以及并发控制(如 leader 选举.分布式锁等). kubernete ...
- 树莓派蓝牙rfcomm协议通信
修改配置文件 手机使用 "蓝牙串口" 软件,树莓派上修改文件/etc/systemd/system/dbus-org.bluez.service ExecStart=/usr/li ...
- Vue3“直接”修改props
父组件 import { reactive } from 'vue'; //对话框数据 const show = reactive({ isshow: false, }); //打开对话框 const ...
- 干货 | 如何快速实现 BitSail Connector?
简介 本文面向 BitSail 的 Connector 开发人员,通过开发者的角度全面的阐述开发一个完整 Connector 的全流程,快速上手 Connector 开发. 目录结构 首先开发者需要通 ...
- Spring 6 源码编译和高效阅读源码技巧分享
一. 前言 Spring Boot 3 RELEASE版本于 2022年11月24日 正式发布,相信已经有不少同学开始准备新版本的学习了,不过目前还不建议在实际项目中做升级,毕竟还有很多框架和中间件没 ...