Could not build project with vue cli 3 template due to svg in css Could not build project with vue cli 3 template due to svg in css vue.js vue.js

Could not build project with vue cli 3 template due to svg in css


I don't have a fix or full explanation, but there is a workaround...

The problem seems to be caused by postcss-import when importing the CSS file from inside a <style> tag of an SFC:

// App.vue<style lang="scss">  @import 'app.scss'; /* imports default.css -> default-skin.svg */</style>

You can workaround the build error by moving the import into the <script> tag (or to main.js):

// App.vue<script>  import 'app.scss'; /* imports default.css -> default-skin.svg */</script>

see GitHub repo


Try Deleting node modules folder and then run yarn install again.

If didn't work try:

global.navigator = {  userAgent: 'node.js'};


Ref vue-pswipe, GuoQichen uses this config for svg.

config.module  .rule('svg')  .use('file-loader')  .clear()  .loader('url-loader')  .options({    limit: 4 * 1024,    name: 'img/[name].[hash:8].[ext]',  })