@rollup/plugin-inject 扫描模块代码,找到需要替换的全局变量,同时通过Import注入变量

475 阅读1分钟
// vite.config.ts
import { resolve } from 'path';
import vue from '@vitejs/plugin-vue'
import inject from '@rollup/plugin-inject'; // 扫描模块代码,找到需要替换的全局变量,同时通过Import注入变量

export default defineConfig({
    plugins: [
        vue(),
        inject({ 
            exclude: '*/node_modules/element-plus/**',
            include: '**/*.*',
            modules: {
              '_' : 'lodash',
            },
        })
    ],
// helloworld.vue
<template>
  {{ title }}
</template>
<script setup lang="ts">
 import { ref, onMounted } from 'vue'
 const title =ref<string>('')
 const name = '张三'
 onMounted(() => {
     const newname = _.cloneDeep(name)
     console.log(ctab);
     title.value = newname
 })
 
</script>
<style></style>

页面可以自动引入 import _ from 'lodash', 但是会报警告

image.png

注释exclude 和 include 也是上免得警告

如果 include: '*/node_modules/element-plus/**' 警告会消失

但是lodash 自动引入失败

有没有大佬遇到过这个问题是不是 include: '' 配置的不对求解