如何引用通过npm安装的库的CSS？

所以比如说我安装了一些东西：

npm install --save something 

并下载到

 ./node_modules/something/ 

它有一个文件夹，也许有所谓的styles并在该文件夹中有something.css 。 我将如何包括该CSS文件在我的HTML文档（如果我的HTML文档沿着 – node-modules文件夹？

我的意思是我可以在我的HTML头做这个：

 <link rel="stylesheet" href="./node_modules/something/styles/something.css" type="text/css" media="screen" /> 

但是在你的node_modules目录中寻找东西感觉不对。 特别是如果html文件可能需要被缩小，然后扔进一些./dist/目录。 因为那么something.css的path是closures的..

没有办法简单地去：

 <link rel="stylesheet" href="something.css" type="text/css" media="screen" /> 

在你的html文档中 – 不pipe它在哪里坐在你的项目结构 – 它只会知道去哪里find该CSS文件？

Answer 1

有一个叫做npm-css的包

在webpack中，你可以像require('bootstrap.css')那样需要css，这就是为什么通过npm安装css非常有用

如果你没有它，你可以创build一个npm脚本任务，它需要（使用fs.readFile）来自node_modules的所有css文件，将它们编译成单个文件（这就是npm-css所做的）

Answer 2

其实没有必要明确地引用您的HTML头中的CSS文件。 因为你已经通过npm参与了css库，所以一旦你运行npm start来运行你的项目，Node.js将加载所有的node_moudules，它也包括你需要的css库。

Answer 3

取决于您使用的模块加载器。 例如Webpack然后请阅读这个链接https://github.com/JedWatson/react-select/issues/176

否则，在你的服务器上，你需要将node_modules作为静态文件目录，然后你就可以安全的完成了

 <link rel="stylesheet" href="./node_modules/something/styles/something.css" type="text/css" media="screen" /> 

这在那里是没有害处的