Liora

Common Vite Config

vite; config
102 words

resolve.alias

In Vite, you can configure aliases through the resolve.alias configuration option. This allows you to use aliases to import modules in your project.

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

Using Custom Elements in Vue

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

export default {
  plugins: [
    vue({
      template: {
        compilerOptions: {
          // Treat all tags with hyphens as custom elements, as well as some special tags
          isCustomElement: (tag) => tag.includes('-') || ['wx-open-launch-weapp'].includes(tag),
        }
      }
    })
  ]
}

See Using Custom Elements in Vue for more details.