vue.js - 在 Vue CLI 3 中包含“normalize-scss”

Question

刚刚将包添加normalize-scss到我的新 Vue 项目中，但没有应用任何样式......我都尝试了：

@import 'normalize-scss'在我的styles.scss

import 'normalize-scss'在我的main.js页面

难道我做错了什么？该包显然在那里，因为应用程序运行，但它实际上并没有应用任何 css 规则。

Answer 1

我想到了。您需要normalize()在导入后将其放在 main.scss 文件中。所以：

@import 'normalize-scss';
@include normalize();

Answer 2

使用 npm 安装后，将其导入 main.js 文件的顶部：

import "normalize.css"

Answer 3

如果您有一个已使用的主/全局 scss 文件：

1. 将 normalize.css（其中任何一个）添加到您的项目中：（yarn add normalize.css或 npm）
2. 在你的 main.scss 例如：@import '~normalize.css';

请注意~cli 文档所说的歧义：https ://cli.vuejs.org/guide/css.html#referencing-assets

Answer 4

1. npm install --save normalize-scss
2. 在主 scss 文件中@import "normalize-scss/sass/normalize/import-now";

Answer 5

不确定这是否是正确的方法，但是，如果您使用的是 vue-templates，也许您可​​以尝试导入样式：

<style lang="scss">
  @import 'src/assets/css/mycss_lib.css';
</style>

还要记住，不要scoped在样式标签中使用。你还需要，scss loader并且node-sass使这项工作。