Vue | 如何从特定的NPM包中导入样式表？

Question

我正在尝试加载animate.css。使用命令npm install --save animate.css安装了此软件包。那么，最佳的导入它到项目中的方法是什么呢？

我找到了一些解决方案，要求将文件复制到static文件夹中并从那里加载。但是我不想这样做，因为如果我们将其移动出软件包，就会失去NPM的所有好处。

- Julien Le Coupanec

Answer 1

假设您希望在应用程序中全局使用 animate.css，则需要在您的 webpack 中进行以下操作：

module: {
  loaders: [
    { test: /\.css$/, loader: "css-loader" }
  ]
}

在你的 main.js 文件中。

import 'animate.css/animate.min.css'

- CuriousGuy

Answer 2

在我的项目中，我使用了src imports来处理类似的情况。

在你的 App.vue 组件中添加两个样式标签，一个用于全局样式，因为 App.vue 是入口点，另一个用于带有作用域属性的任何作用域样式。

<style src="animate.css/animate.min.css">
    /* global styles */
</style> 

<style scoped>
    /* local styles */
</style> 

- Vamsi Krishna