damianstasik / vue-svg-loader

🔨 webpack loader that lets you use SVG files as Vue components
https://vue-svg-loader.js.org
MIT License
645 stars 86 forks source link

[Vue warn]: Error in nextTick: "InvalidCharacterError: Failed to execute 'createElement' on 'Document' #202

Closed BuddhaNag12 closed 1 year ago

BuddhaNag12 commented 1 year ago

I'm unable to solve the svg loader issue.

Occurance:

image image

Packages version: "vue": "2.7.0" "vue-template-compiler": "2.7.0" "vue-svg-loader": "^0.16.0",

My svg loader configuration

svg.d.ts declare module "*.svg" { const content: any export default content }

vue.config.js `module.exports = { chainWebpack: (config) => { const svgRule = config.module.rule('svg')

    svgRule.uses.clear()

    svgRule
        .use('babel-loader')
        .loader('babel-loader')
        .end()
        .use('vue-svg-loader')
        .loader('vue-svg-loader')
        .options({
            svgo: {
                plugins: [
                    { removeDimensions: true },
                    { removeViewBox: false }
                ]
            }
        })
}

}`

BuddhaNag12 commented 1 year ago

The issue is resolved after adding this code to vue.config.js Solution link https://stackoverflow.com/questions/49904540/svg-loading-vue-svg-loader-vue-warn-invalid-component-definition module.exports = { chainWebpack: config => { config.module.rules.delete("svg"); }, configureWebpack: { module: { rules: [ { test: /.svg$/, loader: 'vue-svg-loader', }, ], }
} };