Vue3 + Vite 多入口配置

试了一下多入口跳转的问题:

import {defineConfig} from "vite";
import vue from "@vitejs/plugin-vue";
import path from "path";
import styleImport, {VantResolve} from "vite-plugin-style-import";

// https://vitejs.dev/config/
export default defineConfig({
    server: {
        open: true,
        port: 3005,
        host: "0.0.0.0",
    },
    resolve: {
        alias: {
            "@": path.resolve(__dirname, "src"),
        },
    },
    build: {
        emptyOutDir: true,
        rollupOptions: {
            input: {
                entry: path.resolve(__dirname, 'index.html'),
                privacy: path.resolve(__dirname, 'privacy.html'),
                terms: path.resolve(__dirname, 'terms.html'),
                refund: path.resolve(__dirname, 'refund.html'),
                about: path.resolve(__dirname, 'about.html'),
            }
        }
    },
    plugins: [
        vue(),
        styleImport({
            resolves: [VantResolve()],
        }),
    ],
});

其实就是多了个build

empty就是“是否清空输出目录”,默认也是true。

然后就会出现这样的报错:

[vite]: Rollup failed to resolve import "src/main.js" from "index.html".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`
error during build:
Error: [vite]: Rollup failed to resolve import "src/main.js" from "index.html".
This is most likely unintended because it can break your application at runtime.

npm ERR! [email protected] build_local: `vite build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build_local script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\admin\AppData\Roaming\npm-cache\_logs\2022-09-05T03_36_40_610Z-debug.log
 


改成
 

style引用的类似报错也按照这么处理即可

你可能感兴趣的:(vue.js,javascript,前端)