CODEWITHSUNDEEP
javascriptwebpackvue.jsbuildcore-ui
Hula Hula
Hula Hula

Reputation: 573

Font not found, vuejs build

I have in my config/index.js:

...
build: {
    index: path.resolve(__dirname, 'dist/client.html'),
    assetsRoot: path.resolve(__dirname, 'dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: '',
...

My App.vue:

<style lang="scss">
  /* Import Font Awesome Icons Set */
  $fa-font-path: '~font-awesome/fonts/';
  @import '~font-awesome/scss/font-awesome.scss';
  ...
</style>

When in dev mode it's all right, no missing assets etc..., everything is fine.

But when I build the project the fonts path becomes:

dist/static/css/static/fonts/font

And this results in a 404 error for the given asset, since I have no folders inside ths css and I have no idea why is doing this.

Please note that I don't want this to be in the root, e.g:

assetsPublicPath: '/', // <-- don't want this since the project it's going to be in a subfolder

If you guys think that are some scripts missing for a better/less equivocating answer please tell me and I edit it to include them.

Upvotes: 0

Views: 847

Answers (1)

Ru Chern Chong
Ru Chern Chong

Reputation: 3756

Remove whatever you have posted in App.vue pertaining to Font Awesome.

Inside of main.js or app.js, do the following. It should start to build nicely.

main.js / app.js

require('font-awesome/scss/font-awesome.scss')

Upvotes: 1

Related Questions