VueJS 2: Local assets

Question

I made a project with the cli and I have some css and js files in the assets folder that was generated. I am trying to add them to the index.html file but it keeps coming back as a 404. Is there a different way I need to add my local css and javascript files?

Answer 1

Assuming you're using the webpack template, try /src/assets/... in the index.html

Answer 2

In your webpack config file, you can add an alias for your assets folder:

module.exports = { 
  ...
  resolve: {
    alias: {
      'assets': path.resolve(__dirname, '../src/assets'),
    },
    ...
  },
  ...
},

Then, in your application, you can reference this folder like so:

// in a .less file
@import "~assets/css/vars"

// in a .js file
require("assets/js/utils")