首页 > 解决方案 > main.scss 自动更新的问题

问题描述

这是我所有导入的 main.scss 文件...

@import "abstracts/functions";
@import "abstracts/mixins";
@import "abstracts/variables";

@import "base/animations";
@import "base/base";
@import "base/typography";
@import "base/utilities";

@import "components/bg-video";
@import "components/button";
@import "components/cards";
@import "components/composition";
@import "components/feature-box";
@import "components/form";
@import "components/story";

@import "layout/footer";
@import "layout/grid";
@import "layout/header";
@import "layout/navigation";

@import "pages/home";

在我的布局文件夹中创建@import“布局/导航”文件后,我开始遇到这个问题。除非我在包含 @imports 的 main.scss 中手动保存,否则似乎没有什么会自动重新加载,然后才会更新。我下载了实时 sass 编译器以及 vs 代码上的 sass 扩展,并关闭了实时服务器和终端,我运行了所有东西。然后我开始在 vs 代码中使用这些扩展和集成终端...... 15.3 和 npm 版本 6.14.9。我尝试在终端中使用 npm install -g node-sass 命令重新安装 node-sass,但出现权限被拒绝错误...该站点现在也完全没有响应,如果我在文件中更改它,则无法单击任何可单击的内容,并且页面上没有任何更改。我不知道如何解决这个问题,请帮忙。

标签: sassterminalnode-modulesnpm-live-server

解决方案


Add the '_' in front of scss files. and check in VS Code.

/scss
 main.scss
 layout/_header.scss
 layout/_footer.scss

推荐阅读