Включить 'normalize-scss' в Vue CLI 3

Question

Только что добавил пакет normalize-scss к моему новому проекту Vue, но ни один из стилей не применяется... Я пробовал оба:

@import 'normalize-scss' в моем styles.scss

import 'normalize-scss' в моем main.js страница

Я делаю что-то неправильно? Пакет явно присутствует, потому что приложение работает, но на самом деле оно не применяет никаких правил CSS.

Answer 1

Я понял. Вам нужно поставить normalize() после того, как вы импортируете его. Так:

@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

Answer 4

Не уверен, что это правильный способ сделать это, но, если вы используете vue-templates, возможно, вы можете попробовать импортировать стиль, выполнив это:

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

Также помните, не используйте scoped в стиле теги. Вам также нужно, scss loader а также node-sass чтобы сделать эту работу.

Answer 5

1. npm install --save normalize-scss
2. В основном файле scss @import "normalize-scss/sass/normalize/import-now";