js文件import css文件时干了什么呢？

Question

因为经常在vue项目的main.js中import样式文件，所以一直有这么个疑惑；
js文件之间相互export/import倒是理解；
但是一直不理解js文件中import xxx.css文件是怎么个机制？因为我如果直接把这个css文件的代码复制到js文件中是报错的，js引用css文件时，底层干了些啥呢？
我看mdn上也只有js文件相互引用的相关例子😭：
https://developer.mozilla.org...

Answer 1

这跟 JS 没有关系，这也不是 JS 本身的能力，而是 Webpack / Rollup 这类构建工具带来的。

以 Webpack 为例，在构建过程中识别这种 CSS 导入是 css-loader 做的。感兴趣的话可以自行搜索 css-loader 的有关资料。