kaios-vue-template/vite.config.js at master · antonynyt/kaios-vue-template · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { babel, getBabelOutputPlugin } from '@rollup/plugin-babel'
import { resolve } from 'path'
import css from 'rollup-plugin-css-only'

// https://vitejs.dev/config/
export default defineConfig({
    plugins: [
        vue(),
        // we'll extract any component CSS out into
        // a separate file - better for performance
        css({ output: 'bundle.css' }),
        babel({
            extensions: ['.js', '.ts', '.html', '.svelte'],
            babelHelpers: 'runtime',
            exclude: ['node_modules/@babel/**'],
            plugins: [
                '@babel/plugin-syntax-dynamic-import',
                [
                    '@babel/plugin-transform-runtime',
                    {
                        useESModules: true,
                        regenerator: false,
                    },
                ],
            ],
        }),
        // vite transpilee to es5:
        // https://github.com/vitejs/vite/issues/10981#issuecomment-1321383114
        getBabelOutputPlugin({
            allowAllFormats: true,
            presets: [
                [
                    '@babel/preset-env',
                    {
                        targets: { firefox: '48' },
                        exclude: ['@babel/plugin-transform-regenerator'],
                    },
                ],
            ],
        }),
    ],
    build: {
        target: 'es2015',
        rollupOptions: {
            input: 'src/main.js',
            output: {
                name: 'app',
                format: 'iife',
                dir: resolve(__dirname, 'dist'),
                entryFileNames: `bundle.js`,
                chunkFileNames: `bundle.js`,
                assetFileNames: `bundle.[ext]`,
            },
            context: 'window',
        },
    },
    resolve: {
        alias: {
            '@': resolve(__dirname, 'src'),
        },
    },
    server: {
        port: 5173,
    },
    css: {
        postcss: true,
    }
})