编辑SASS文件(.SCSS)

问题描述 投票:0回答:1

我是一个完全的SASS初学者!我有一个使用SASS的定制的WP网站。

我有一个使用SASS的自定义WP网站,当我尝试在.SCSS文件中编辑任何样式时,这些变化不会在前端显示。

我使用VS代码编辑器和 "Live SASS编译器 "附加组件,但当我做出改变时,它们仍然不能反映在前端。

很明显我在这里遗漏了什么,但真的不知道从哪里开始。

我想做的就是对网站的风格进行修改。

我只想对网站的风格进行修改,谢谢

sass gulp-sass
1个回答
1
投票

你需要确保SASS已经安装在你的机器上--请查看 官方安装链接.

一旦安装了SASS,本答案的其余部分将涉及使用命令行的一些基本命令。

让我们假设你的CSS和SCSSSASS文件夹是这样排列的。

C:/Users/Me/development

/wordpress/wp-content/themes/my-theme/assets/css
/wordpress/wp-content/themes/my-theme/assets/scss

打开你喜欢的命令行界面--比如PowerShell或Command Prompt。首先,通过输入以下命令并按回车键来检查SASS是否已经安装。

sass --version

你应该会得到一个数字--如果没有,你需要再次运行安装说明,确保你做的一切都正确。

如果工作正常,你现在需要导航到包含资产的目录。当你加载命令行界面时,你应该在你的用户或主目录中--在这个例子中,那将是 C:/Users/Me. 如果使用PowerShell,你会在闪烁的尾号前看到你当前的工作目录。

你可以使用 更改目录 命令 cd - 来导航到你的主题资产文件夹。使用上面的例子文件路径。

cd development/wordpress/wp-content/themes/my-theme/assets

一旦进入这个目录,你可以运行SASS的 --watch 命令来观察目录的变化,并在保存时进行编译。

sass --watch scss:css

上面的命令会观察SCSS文件夹,并将编译后的CSS放在CSS文件夹中。编辑完成后,在终端内按CTRLCMD+C(命令行),然后按 Y 停止观察SCSS文件的变化。

© www.soinside.com 2019 - 2024. All rights reserved.