MMF-FE / svgicon

SVG icon components and tool set
https://mmf-fe.github.io/svgicon
MIT License
922 stars 95 forks source link

vue3: vue-template-compiler must be installed as a peer dependency #130

Closed dspangenberg closed 3 years ago

dspangenberg commented 4 years ago

Hi,

if I use

`transformAssetUrls: {

},`

in .vue-svgicon.config.js like in the demo/vue-demo/.vue-svgicon.config in the documentation, I get the following errors:

Module Error (from ./node_modules/vue-loader/lib/index.js):
[vue-loader] vue-template-compiler must be installed as a peer dependency, or a compatible compiler implementation must be passed via options.

Module Error (from ./node_modules/vue-loader/lib/index.js):
[vue-loader] vue-template-compiler must be installed as a peer dependency, or a compatible compiler implementation must be passed via options.

Module Error (from ./node_modules/vue-loader/lib/index.js):
[vue-loader] vue-template-compiler must be installed as a peer dependency, or a compatible compiler implementation must be passed via options.

Module build failed (from ./node_modules/vue-loader/lib/index.js):
TypeError: Cannot read property 'parseComponent' of undefined
    at parse (/Users/dspangenberg/Projects/myra/test/node_modules/@vue/component-compiler-utils/dist/parse.js:15:23)
    at Object.module.exports (/Users/dspangenberg/Projects/myra/test/node_modules/vue-loader/lib/index.js:67:22)

.vue-svgicon.config.js

const path = require('path')
const svgFilePaths = ['./src/assets/svgs'].map((v) => path.resolve(v))
const tagName = 'icon'

module.exports = {
  tagName,
  svgFilePath: svgFilePaths,
  svgoConfig: {},
  pathAlias: {
    '@icon': svgFilePaths[0]
  },
  transformAssetUrls: {
    [tagName]: ['data'],
  }
}

Vue.config.js:

module.exports = {
  runtimeCompiler: true
}
Allenice commented 3 years ago

If you want to use transformAssetUrls, please upgrade vue-loader to v16+

yarn add vue-loader@next --dev