Skip to content

docs: additionalData option for sass-loader 9.0 #5673

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Jul 13, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions docs/guide/css.md
Original file line number Diff line number Diff line change
Expand Up @@ -133,17 +133,17 @@ module.exports = {
// pass options to sass-loader
// @/ is an alias to src/
// so this assumes you have a file named `src/variables.sass`
// Note: this option is named as "data" in sass-loader v7
// Note: this option is named as "prependData" in sass-loader v8
sass: {
prependData: `@import "~@/variables.sass"`
additionalData: `@import "~@/variables.sass"`
},
// by default the `sass` option will apply to both syntaxes
// because `scss` syntax is also processed by sass-loader underlyingly
// but when configuring the `data` option
// but when configuring the `prependData` option
// `scss` syntax requires an semicolon at the end of a statement, while `sass` syntax requires none
// in that case, we can target the `scss` syntax separately using the `scss` option
scss: {
prependData: `@import "~@/variables.scss";`
additionalData: `@import "~@/variables.scss";`
},
// pass Less.js Options to less-loader
less:{
Expand Down
8 changes: 4 additions & 4 deletions docs/ru/guide/css.md
Original file line number Diff line number Diff line change
Expand Up @@ -135,17 +135,17 @@ module.exports = {
// передача настроек в sass-loader
// @/ это псевдоним к каталогу src/ поэтому предполагается,
// что у вас в проекте есть файл `src/variables.scss`
// Примечание: эта опция называется "data" в sass-loader v7
// Примечание: эта опция называется "prependData" в sass-loader v8
sass: {
prependData: `@import "~@/variables.sass"`
additionalData: `@import "~@/variables.sass"`
},
// по умолчанию опция `sass` будет применяться к обоим синтаксисам
// потому что синтаксис `scss` по сути также обрабатывается sass-loader
// но при настройке опции `data` синтаксис `scss` требует точку с запятой
// но при настройке опции `prependData` синтаксис `scss` требует точку с запятой
// в конце оператора, в то время как для `sass` точки с запятой не требуется
// в этом случае синтаксис `scss` можно настроить отдельно с помощью опции `scss`
scss: {
prependData: `@import "~@/variables.scss";`
additionalData: `@import "~@/variables.scss";`
},
// передача настроек Less.js в less-loader
less:{
Expand Down
21 changes: 4 additions & 17 deletions docs/zh/guide/css.md
Original file line number Diff line number Diff line change
Expand Up @@ -126,29 +126,16 @@ module.exports = {
sass: {
// @/ 是 src/ 的别名
// 所以这里假设你有 `src/variables.sass` 这个文件
// 注意:在 sass-loader v7 中,这个选项名是 "data"
prependData: `@import "~@/variables.sass"`
// 注意:在 sass-loader v8 中,这个选项名是 "prependData"
additionalData: `@import "~@/variables.sass"`
},
// 默认情况下 `sass` 选项会同时对 `sass` 和 `scss` 语法同时生效
// 因为 `scss` 语法在内部也是由 sass-loader 处理的
// 但是在配置 `data` 选项的时候
// 但是在配置 `prependData` 选项的时候
// `scss` 语法会要求语句结尾必须有分号,`sass` 则要求必须没有分号
// 在这种情况下,我们可以使用 `scss` 选项,对 `scss` 语法进行单独配置
scss: {
// sass-loader v8语法
// prependData: `@import "~@/variables.scss";`
// sass-loader v9语法
additionalData(content, loaderContext) {
const { resourcePath, rootContext } = loaderContext;
const relativePath = path.relative(rootContext, resourcePath);
if (
relativePath.replace(/\\/g, "/") !== "src/styles/variables.scss"
) {
return '@import "~@/styles/variables.scss";' + content;
}
return content;
},

additionalData: `@import "~@/variables.scss";`
},
// 给 less-loader 传递 Less.js 相关选项
less:{
Expand Down