Liora

常用的 VIte Config

vite; config
137 字

resolve.alias

在 Vite 中，我们可以通过 resolve.alias 配置项来配置别名。这样在项目中就可以使用别名来引入模块。

import { defineConfig } from 'vite';
import path from 'node:path'

const alias = {
  '@': path.resolve(__dirname, 'src'),
};

export default defineConfig({
  resolve: {
    alias,
  },
});

plugin

@vitejs/plugin-vue npm

在 Vue 中使用自定义元素

// vite.config.js
import vue from '@vitejs/plugin-vue'

export default {
  plugins: [
    vue({
      template: {
        compilerOptions: {
          // 将所有带短横线的标签名都视为自定义元素，以及一些特殊的标签名
          isCustomElement: (tag) => tag.includes('-') || ['wx-open-launch-weapp'].includes(tag),
        }
      }
    })
  ]
}

详见 Using Custom Elements in Vue