vue3.0 webpack&vite配置不解析特定元素标签

vue3.0 webpack & vite 配置不解析特定元素标签 (isCustomElement)

自定义标签如果不是 vue components里面注册的组件，vue compiler 编译器在解析的时候会抛出错误提示，如果不想让编译器解析这个自定义标签，需要在webpack或者vite里面将自定义元素的规则传递到webpack或者vite的编译选项中。

1. vite

export default defineConfig({
  plugins: [vue({
    template:{
      compilerOptions:{
        isCustomElement: tag => tag.startsWith('ion-')
      }
    }
  })],
})

2. webpack

  module.exports = function(){
    chainWebpack: (config) => {
    config.module
      .rule("vue")
      .use("vue-loader")
      .tap((options) => {
        options.compilerOptions = {
          ...options.compilerOptions,
          isCustomElement: (tag) => tag.startsWith("ion-"),
        };
      });
  },