官方文档还是有点难懂,然后点链接找到了 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. 嵌入式-C语言基础:指针

    指针就是地址,变量的值可以通过两种方式访问,一个是通过变量名,一个是通过地址访问. 从而引出一个问题,即什么是指针变量?整型(字符)变量就是存放整形(字符)的变量,指针变量就是存放指针的变量,也就是存 ...

  2. 2022春每日一题:Day 8

    题目:[HNOI2003]激光炸弹 二维前缀和,扫大小为m*m的矩形,取最大即可. 代码: #include <cstdio> #include <cstdlib> #incl ...

  3. PHP 模仿表单提交

    function curl($url,$data,$headers){ $curl = curl_init(); // 启动一个CURL会话 curl_setopt($curl, CURLOPT_UR ...

  4. PHP实现CURL发送请求

    public function curl($url, $params = false, $ispost = 0) { $httpInfo = array(); //初始化 $ch = curl_ini ...

  5. 04.Javascript学习笔记3

    1.箭头函数 箭头函数是一种更短的函数表达式. const age = birthyear => 2022 - birthyear; console.log(age(2000)) 箭头左边的bi ...

  6. MySQL可视化软件(Navicat)部署与使用

    目录 一:可视化软件(Navicat) 1.什么是可视化软件? 2.什么是Navicat? 二:部署MySQL(Navicat) 1.Navicat连接本地MySQL 2.连接MySQL,输入密码,在 ...

  7. Mac系统下word论文参考文献更新域

    写论文的时候可能会遇到后续要增加文献的情况 在参考文献增加后会发现文章中的交叉引用的序号并没有更新 下面分享两种情况的处理方法 一.更新全部域 首先确认自己的打印️项是选中的 2.  打开word偏好 ...

  8. 说透 Kubernetes 监控系列 - 概述

    本文作者孔飞,来自快猫星云团队,Kubernetes专家,Categraf 采集器核心研发工程师 云原生包含了开源软件.云计算和应用架构的元素.云计算解决开源软件的运行门槛问题,同时降低了运维成本和基 ...

  9. 真实世界的人工智能应用落地——OpenAI篇 ⛵

    作者:韩信子@ShowMeAI 深度学习实战系列:https://www.showmeai.tech/tutorials/42 本文地址:https://www.showmeai.tech/artic ...

  10. 14、java.sql.SQLException: 无效的列类型: 1111 报错问题解决

    转载自 在项目中利用Mybatis做持久化框架,XXXMapper.xml中insert语句做插入时,偶然会遇到一些报错或者说是问题,如下: 一.报错日志: nested exception is o ...