Vuejs loading CSS and JS files giving MIME type error



I have created a new vue-webpack project. when I want to add CSS and js files through link and script it gives me this error The stylesheet http://localhost:8080/src/assets/styles.css was not loaded because its MIME type, “text/html”, is not “text/css”. and for js files, it gives this error Uncaught SyntaxError: expected expression, got '<' I have included them inside index.html file.

I used to work like this, but now at this time, I am facing this.

css file:

body {background:black;}

js file:

console.log('hello world')

index.html:

<html>
  <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <title>myapp</title>
     <link rel="stylesheet" href="./src/assets/styles.css">
  </head>
  <body>
    <div id="app"></div>
    <script src="./src/assets/form.js"></script>
  </body>
</html>

Answer

Importing the assets from main.js solved the problem.



Source: stackoverflow