vite+vue3.0+ts 如何在配置在dev环境中引入文件？

Question

需要在app.vue 使用import引入一个在src目录下的js文件 但是只需要在dev环境中引入 但是由于import必须在一开始就引入 不能写判断 请问还有没有其他的配置方式

Answer 1

如果是配置文件的话，可以利用 vite.config.js 的 define 选项，比如：

vite.config.js

import config from './src/your-config.js';

export default defineConfig(({command}) => {
  define: {
    // serve 为开发命令
    myConfig: command === 'serve' ? JSON.stringify(config) : '';
  },
});

main.ts

if (myConfig) {
  const yourConfig = JSON.parse(myConfig);
}

然后你就直接使用 yourConfig 即可。