官方文档还是有点难懂,然后点链接找到了 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 项目的更多相关文章

  1. 【Parcel 2 + Vue 3】从0到1搭建一款极快,零配置的Vue3项目构建工具

    前言 一周时间,没见了,大家有没有想我啊!哈哈!我知道肯定会有的.言归正传,我们切入正题.上一篇文章中我主要介绍了使用Vite2+Vue3+Ts如何更快的入手项目.那么,今天我将会带领大家认识一个新的 ...

  2. 快速新建并配置一个eslint+prettier+husky+commitlint+vue3+vite+ts+pnpm的项目

    前置准备 一台电脑 vscode pnpm vscode插件:ESLint v2.2.6及以上 vscode插件:Prettier - Code formatter v9.5.0及以上 vscode插 ...

  3. Vue3.x全家桶+vite+TS-搭建Vue3.x项目

    目录 一.搭建基础项目 1.vite创建项目 3.运行项目 2.环境变量设置介绍 vite配置多环境打包 二.配置Router 1.安装路由 2.配置路由 3.引入 三.配置Vuex 1.安装vuex ...

  4. Vue3.x全家桶+vite+TS-构建Vue3基本框架

    目录 一.搭建基础项目 1.vite创建项目 3.运行项目 2.环境变量设置介绍 vite配置多环境打包 二.配置Router 1.安装路由 2.配置路由 3.引入 三.配置Vuex 1.安装vuex ...

  5. 学习 vue3 第一天 vue3简介,创建vue3项目 Composition Api 初识

    前言: 从今天开始来和大家一起学习 vue3 相信大家都不陌生,已经火了一段时间了,但是还是有不少人没有学习,那就跟着六扇老师来简单的入个门 废话不多说,来开始今天的学习 Vue3 简介: 2020年 ...

  6. Git 基础 —— 安装 配置 别名 对象

    Git 基础学习系列 Git 基础 -- 安装 配置 别名 对象 Git 基础 -- 常用命令 Git 基础 -- 常见使用场景 Git基础 -- Github 的使用 Git 安装 Git下载地址 ...

  7. webpack配置别名alias

    在webpack.config.js中,通过设置resolve属性可以配置查找“commonJS/AMD模块”的基路径,也可以设置搜索的模块后缀名,还可以设置别名alias.设置别名可以让后续引用的地 ...

  8. Vite ❤ Electron——基于Vite搭建Electron+Vue3的开发环境【一】

    背景 目前社区两大Vue+Electron的脚手架:electron-vue和vue-cli-plugin-electron-builder, 都有这样那样的问题,且都还不支持Vue3,然而Vue3已 ...

  9. 从零搭建基于webpack的Electron-Vue3项目(1)——基于webpack的Vue3项目搭建

    从零搭建基于webpack的Electron-Vue3项目(1)--基于webpack的Vue3项目搭建 前言 本篇文章内容,主要是基于webpack的Vue3项目开发环境进行搭建,暂时还不涉及到El ...

  10. Vue3项目搭建规范

    Vue3项目搭建规范 一. 代码规范 1.1 集成editorconfig配置 EditorConfig有助于为不同IDE编辑器上维护一致的编码风格 安装插件:EditorConfig for VS ...

随机推荐

  1. 【Azure 事件中心】 org.slf4j.Logger 收集 Event Hub SDK(Java) 输出日志并以文件形式保存

    问题描述 在使用Azure Event Hub的SDK时候,常规情况下,发现示例代码中并没有SDK内部的日志输出.因为在Java项目中,没有添加 SLF4J 依赖,已致于在启动时候有如下提示: SLF ...

  2. 《吐血整理》高级系列教程-吃透Fiddler抓包教程(34)-Fiddler如何抓取微信小程序的包-上篇

    1.简介 有些小伙伴或者是童鞋们说小程序抓不到包,该怎么办了???其实苹果手机如果按照宏哥前边的抓取APP包的设置方式设置好了,应该可以轻松就抓到包了.那么安卓手机小程序就比较困难,不是那么友好了.所 ...

  3. [leetcode] 713. Subarray Product Less Than K

    题目 Given an array of integers nums and an integer k, return the number of contiguous subarrays where ...

  4. PHPMQTT问题一二三

    问题一:PHPMQTT作为客户端订阅超过一定数量的主题后,系统就会报错. 思路:在网上查找原因,失败: 打开调试debug = true ; 结果proc方法中报错: eof receive 问题二: ...

  5. Docker遇见golang https://www.jianshu.com/p/37693eb8f646

    golang logo 在我国古代,传说天庭中有种种天兵天将,有看守四大天门的(docker0网桥),有负责传话的门将(REST API),有负责人间和天界联络的,如财神爷,土地公等(NAT,DNS) ...

  6. 【云原生 · Kubernetes】kubernetes v1.23.3 二进制部署(三)

    5 部署 etcd 集群 etcd 是基于 Raft 的分布式 KV 存储系统,由 CoreOS 开发,常用于服务发现.共享配置以及并发控制(如 leader 选举.分布式锁等). kubernete ...

  7. 树莓派蓝牙rfcomm协议通信

    修改配置文件 手机使用 "蓝牙串口" 软件,树莓派上修改文件/etc/systemd/system/dbus-org.bluez.service ExecStart=/usr/li ...

  8. Vue3“直接”修改props

    父组件 import { reactive } from 'vue'; //对话框数据 const show = reactive({ isshow: false, }); //打开对话框 const ...

  9. 干货 | 如何快速实现 BitSail Connector?

    简介 本文面向 BitSail 的 Connector 开发人员,通过开发者的角度全面的阐述开发一个完整 Connector 的全流程,快速上手 Connector 开发. 目录结构 首先开发者需要通 ...

  10. Spring 6 源码编译和高效阅读源码技巧分享

    一. 前言 Spring Boot 3 RELEASE版本于 2022年11月24日 正式发布,相信已经有不少同学开始准备新版本的学习了,不过目前还不建议在实际项目中做升级,毕竟还有很多框架和中间件没 ...