How to solve the problem of introducing css error report into vuejs

This article mainly introduces how to solve the problem of introducing css error report into vuejs, which has a certain reference value, and interested friends can refer to it. I hope you will gain a lot after reading this article.

The solution of introducing css error report into vuejs: 1, fill in the parsing dependency; 2, introduce external css file in main.js; 3, introduce external css file in APP.Vue.

This article operating environment: windows7 system, vue2.5.17 version, DELL G3 computer.

How to solve the problem of introducing css error report into vuejs? VueJS introduces some pits in css or less files

When we do Vue+webpack, we will inevitably introduce a variety of public css style files, so how do we introduce it? What kind of holes will there be when it is introduced?

First of all, when introducing a common style, we introduce it in the way that AMD is used in "main.js", that is, require ('. / assets/stylus/index.styl') or: import'. / assets/stylus/index.styl'

At this point, we throw an error because we don't have a dependency to write parsing, and webpack doesn't know how to parse.

At this point, we have to fill in the dependence

Import'! styleMutual loader is loaded by CSssMurray loader.According assetsUnix.

Everything will be all right, and you can start introducing css files.

Of course, before proceeding to the above steps, you need to install several loader== > > npm install style-loader-- save-devnpm install css-loader-- save-devnpm install stylus-loader-- save-dev at the same time in webpack.base.config.js =

At this point you can import the css file.

Several diagrams are attached:

1 introduction of external css files in main.js:

2introducing external css files into APP.Vue:

Thank you for reading this article carefully. I hope the article "how to solve the problem of introducing css into vuejs" shared by the editor will be helpful to everyone. At the same time, I also hope that you will support us and pay attention to the industry information channel. More related knowledge is waiting for you to learn!