【问题标题】：Compile *.scss file with sass-maven-plugin when restart TomCat重启 TomCat 时使用 sass-maven-plugin 编译 *.scss 文件
【发布时间】：2015-07-02 16:37:24
【问题描述】：

我将 pom.xml 配置为使用 sass-maven-plugin，但我想在每次保存 style.scss 时执行编译。使用此配置需要打开一个windows终端并运行“maven clean install”，并且需要打开这个终端来实时编译SCSS文件。

仅使用 Eclipse 可以做到这一点吗？

我的项目里面的 pom.xml 是这样的：

<build>
    <plugins>
        <plugin>
            <groupId>org.jasig.maven</groupId>
            <artifactId>sass-maven-plugin</artifactId>
            <version>1.1.1</version>
            <executions>
                <execution>
                    <id>compile</id>
                    <phase>prepare-package</phase>
                    <goals>
                        <goal>update-stylesheets</goal>
                    </goals>
                </execution>
            </executions>
            <configuration>
                <resources>
                    <resource>
                        <source>
                            <directory>${basedir}/src/main/resources/META-INF/resources/scss</directory>
                        </source>
                        <destination>${basedir}/src/main/resources/META-INF/resources/css</destination>
                    </resource>
                </resources>
                <sassOptions>
                    <cache>false</cache>
                    <always_update>true</always_update>
                </sassOptions>
            </configuration>
        </plugin>
    </plugins>
</build>

【问题讨论】：

标签： eclipse maven tomcat sass

【解决方案1】：

对于自动编译运行 sass-maven-plugin 的 watch 目标：

mvn sass:watch

查看本教程了解更多信息：http://cleancodejava.com/auto-compile-sass-stylesheets-with-maven/

【讨论】：

【解决方案2】：

以下解决方案基于此页面上的指南：http://www.crazed.org.uk/2012/04/integrating-compass-into-eclipse/。

必要的步骤是：

创建一个执行所需 Maven 命令的脚本

在项目的根目录下创建一个批处理文件（例如 ${PROJECT_ROOT}/sass_build.bat），在 pom.xml 旁边，包含以下代码

call mvn sass:update-stylesheets

配置 Eclipse 以在每次保存 SCSS 文件时执行脚本

如果还没有，请打开项目属性窗口（项目 > 属性），然后导航到 Builders 部分。
点击[新建…]
将出现一个标题为“选择配置类型”的对话框。选择“程序”，然后[确定]。
将出现“编辑配置”窗口，用于构建器设置。将新的构建器命名为相关的名称——在本例中，我使用了“SASS Build”；
带有注释的选项卡部分：
- Main 页面配置外部程序
  - 位置：批处理脚本的路径。这必须在环境路径中（在环境页面中设置），或者是完整路径。例如，[${PROJECT_ROOT}/sass_build.bat] 在我的例子中。
  - 工作目录：你希望sass操作的项目路径。例如。 [${PROJECT_ROOT}]
- 下一个 TAB Refresh 指定程序完成编译后要执行的操作。我希望 Eclipse 能够识别更新的 css 文件！
  - “完成后刷新资源”已[选中]
  - “特定资源”设置为保存 css 文件的输出文件夹。例如。 [${PROJECT_ROOT}/src/main/webapp/css]
- 环境允许您设置适用于命令行或应用程序的特定变量（无需更改）
- 构建选项 – 是什么触发了这个构建器？加上杂项。
  - “分配控制台”[选中]，以便我们可以在控制台面板中看到结果
  - 运行构建器：[在清理之后]、[在手动构建期间]和 [在自动构建期间]。
  - “指定相关资源的工作集”[选中] - 将其设置为 sass 源文件夹 - 在我的情况下为 [${PROJECT_ROOT}/src/main/resources/scss]。在此文件夹中发现的任何更改都将触发此构建器。
全部完成后，[确定] 配置。新构建器应显示为列表的最后一项。
确保已在菜单中勾选“项目”>“自动构建”以启用自动编译。

测试您的创作。修改 SCSS 文件并保存。 Eclipse 应该获取更改，将 SCSS 文件编译为 CSS 文件并将其放置在正确的目标文件夹中。如果运气好的话，Tomcat 会拾取更改并部署更改的资源。

【讨论】：