当使用react + webpack时如何使用绝对路径导入自定义scss？

css CSS

Stafan

2020-03-24

在一个scss文件中，我试图导入自定义的，广泛使用的scss块（在React / SASS / Webpack堆栈中）。

这样我就可以使用共享的mixin。

假设我正在创建MyAdminButton，并且想要导入与项目的所有按钮有关的scss文件。（这是自定义的scss，而不是供应商/外部的）。

它看起来像这样： 

//this actually works but it is a code smell : what if the current file moves ?
@import "../../stylesheets/_common-btn-styles.scss";

.my-admin-btn {
    // here I can use a shared mixin defined in _common-btn-styles.scss
}

这听起来不好，因为如果我的scss文件移动了，那么所有内容都将损坏。

谢谢你的帮助

第3347篇《当使用react + webpack时如何使用绝对路径导入自定义scss？》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

共1个回答
米亚村村 2020.03.24

找到了。实际上，您可以在webpack.config.json中配置sass-loader，如此处所述：https : //github.com/jtangelder/sass-loader

这是相关的部分：

sassLoader: {
   includePaths: [path.resolve(__dirname, "./some-folder")]
}

相似问题

0 回答

0 回答

5 回答

25 回答

0 回答

0 回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android