首页 文章

如何在Webpack导入中访问sass变量？

提问于
浏览 次
1

我很难搞清楚如何在React组件的sass文件导入中访问Sass变量 . 这是我当前的目录结构，我使用Webpack捆绑所有东西：

components/
  Sample/
    Sample.jsx
    Sample.scss
sass/
  main.scss
  variables.scss

在 Sample.jsx 内部，我正在导入 Sample.sccs ，但是，来自variables.scss的变量没有通过，因为我假设它们是独立的模块，它们不共享相同的上下文？

我明白我可以通过简单的不需要组件的 .jsx 文件中的样式来解决这个问题，而只是在 main.scss 中单独导入它们，所以它们共享相同的上下文，但保持所有封装的内容会很好 .

reactjs sass webpack

1 回答

  • 0

    您需要在 components/Sample/Sample.scss 文件中导入 variables.scss .

    在 components/Sample/Sample.scss 文件的顶部添加以下内容：

    @import "../../../sass/variables.scss";
    回复于

相关问题