时间戳

首页 > 解决方案 > Wordpress SCSS 文件观察器 - PhpStorm

wordpress - Wordpress SCSS 文件观察器 - PhpStorm

问题描述

我试图在这里和互联网上环顾四周，寻找解决方案，但我找不到任何适用于我当前环境的东西。让我解释一下它是怎么回事，我有一个标准的 Wordpress 项目，我正在 [n] 个不同的地方编写 SCSS：

  1. /wp-content/themes/{my-child-theme}/scss 包含我所有的 _{file_name}.scss 分为 [n] 个目录和一个 style.scss 文件在主题的根目录中加载它们，所以：

在此处输入图像描述

它应该只生成一个 .css 文件：style.css。这是第一个工作目录。

  1. 所有其他都是我开发的自定义插件，所以所有 scss 都将是（我对所有插件使用相同的文件夹结构） /wp-content/plugins/{my_plugin_name}/Resources/assets/css 包含一个 {my_plugin_name} .scss 文件加载所有其他 scss 部分，如上面的屏幕截图所示，因此 /pages 和 /parts + 如果发生这种情况，还有其他内容。我希望在与 {my_plugin_name}.scss 相同的位置生成此 .css。

我习惯使用这个 config.rb 文件：

    http_path = "/"
    css_dir = "/"
    sass_dir = "/"
    images_dir = "/"
    javascripts_dir = "/"

    output_style = :compressed

这个文件观察者conf：

在此处输入图像描述

如果我一直这样，我所有的 .scss 都会被编译，无处不在。这显然是我不想要的。我应该如何配置这个环境（config.rb + 文件观察器）以使其按我想要的方式工作？

如果重要的话，我会在 MacOs Catalina 上使用 PhpStorm 2019.3.4。任何帮助/建议将不胜感激。谢谢

标签： wordpresssassphpstormcompassfile-watcher

解决方案

未来的导航员，这就是我想出来的，因为没有给我解决方案。创建一个文件观察者和用户，并将此行用作观察者配置的“参数”参数。使用范围“项目文件”和工作目录“$ProjectFileDir$”

compile -c config_plugin.rb --debug-info --time --trace --force
compile -c config_theme.rb --debug-info --time --trace --force

其中 config_[what] 是一个单独的文件，如下所示：

http_path = "wp-content/plugins/plugin_name/"
css_dir = "wp-content/plugins/plugin_name/"
sass_dir = "wp-content/plugins/plugin_name/"
sass_dir = "wp-content/plugins/plugin_name/"
images_dir = "wp-content/plugins/plugin_name/"
javascripts_dir = "wp-content/plugins/plugin_name/"

output_style = :compressed

推荐阅读