通过“激活器运行"运行时，获取资产进行编译.进行中 [英] Get assets to compile when running via "activator run" in Play

问题描述

我将Sass用作CSS预处理程序，并且试图通过资产管道运行它.我曾尝试将此sassTask实现为源文件任务和Web资产任务，但两种方法都遇到问题.

I am using Sass as my CSS preprocesser, and I'm trying to have it run via the asset pipeline. I've tried implementing this sassTask as a source file task and as a web asset task, but I'm running into problems both ways.

如果我将Sass作为源任务运行(请参见下文)，则在请求页面并在重新加载页面时发现更新文件时，会在activator run期间触发它.我遇到的问题是，生成的CSS文件全部直接转储到target/web/public/main/lib中，而不是转储到反映它们在resources-managed目录下内置的子目录中的子目录中.我不知道如何做到这一点.

If I run Sass as a source task (see below), it gets triggered during activator run when a page is requested and updated files are found upon page reloads. The problem I'm running into is that the resulting CSS files are all getting dumped directly into target/web/public/main/lib, instead of into the subdirectories reflecting the ones they are getting built into under the resources-managed directory. I can't figure out how to make this happen.

相反，我尝试将Sass编译实现为Web资产任务(请参见下文).据我所知，以这种方式工作，resources-managed没有起作用，因此我将文件直接编译为target/web/public/main/lib.我确定我做得不够动态，但是我不知道如何做得更好.但是这里最大的问题是，通过activator run工作时，管道显然无法运行.我可以使用activator stage来运行它，但是我确实需要在常规开发工作流程中使用它，以便与Scala文件一样，可以在开发服务器运行时更​​改样式文件.

Instead, I tried implementing Sass compilation as a web asset task (see below). Working this way, as far as I can tell, resources-managed does not come into play, and so I compile my files directly into target/web/public/main/lib. I'm sure I'm not doing this dynamically enough, but I don't know how to do it any better. But the biggest problem here is that the pipeline apparently does not run when working through activator run. I can get it to run using activator stage, but I really need this to work in the regular development workflow so that I can change style files as the dev server is running, same as with Scala files.

我尝试通过这些论坛，sbt-web文档以及一些现有的插件进行梳理，但是由于SBT的复杂性以及实际内容的不透明性，我发现此过程非常令人沮丧在构建过程中发生的情况.

I have tried combing through these forums, through the sbt-web docs, and through some of the existing plugins, but I am finding this process to be highly frustrating, due to the complexity of SBT and the opaqueness of what is actually happening in the build process.

将Sass编译作为源文件任务:

Sass compilation as a source file task:

lazy val sassTask = TaskKey[Seq[java.io.File]]("sassTask", "Compiles Sass files")

sassTask := {
  import sys.process._
  val x = (WebKeys.nodeModules in Assets).value
  val sourceDir = (sourceDirectory in Assets).value
  val targetDir = (resourceManaged in Assets).value
  Seq("sass", "-I", "target/web/web-modules/main/webjars/lib/susy/sass", "--update", s"$sourceDir:$targetDir").!
  val sources = sourceDir ** "*.scss"
  val mappings = sources pair relativeTo(sourceDir)
  val renamed = mappings map { case (file, path) => file -> path.replaceAll("scss", "css") }
  val copies = renamed map { case (file, path) => file -> targetDir / path }
  copies map (_._2)
}

sourceGenerators in Assets <+= sassTask

将汇编作为网络资产任务:

Sass compilation as web asset task:

lazy val sassTask = taskKey[Pipeline.Stage]("Compiles Sass files")

sassTask := {
  (mappings: Seq[PathMapping]) =>
    import sys.process._
    val sourceDir = (sourceDirectory in Assets).value
    val targetDir = target.value / "web" / "public" / "main"
    val libDir = (target.value / "web" / "web-modules" / "main" / "webjars" / "lib" / "susy" / "sass").toString
    Seq("sass", "-I", libDir, "--update", s"$sourceDir:$targetDir").!
    val sources = sourceDir ** "*.scss"
    val mappings = sources pair relativeTo(sourceDir)
    val renamed = mappings map { case (file, path) => file -> path.replaceAll("scss", "css") }
    renamed
}

pipelineStages := Seq(sassTask)

推荐答案

我认为，根据与资产管道，源文件任务是一种解决方法:

I think that according to the documentation related to the Asset Pipeline, a Source File task is a way to go:

源文件任务作为插件的示例包括CoffeeScript，LESS和 JSHint.其中一些获取源文件并生成目标网站 资产，例如CoffeeScript生成JS文件.该类别的插件 就功能而言彼此互斥，即 只有一个CoffeeScript插件会采用CoffeeScript源代码，并且 生成目标JS文件.总而言之，源文件插件可产生网络 资产.

Examples of source file tasks as plugins are CoffeeScript, LESS and JSHint. Some of these take a source file and produce a target web asset e.g. CoffeeScript produces JS files. Plugins in this category are mutually exclusive to each other in terms of their function i.e. only one CoffeeScript plugin will take CoffeeScript sources and produce target JS files. In summary, source file plugins produce web assets.

我认为您尝试实现的目标属于此类.

I think what you try to achieve falls into this category.

val sassTask = taskKey[Seq[File]]("Compiles Sass files")

val sassOutputDir = settingKey[File]("Output directory for Sass generated files")

sassOutputDir := target.value / "web" / "sass" / "main"

resourceDirectories in Assets += sassOutputDir.value

sassTask := {
  val sourceDir = (sourceDirectory in Assets).value
  val outputDir = sassOutputDir.value
  val sourceFiles = (sourceDir ** "*.scss").get
  Seq("sass", "--update", s"$sourceDir:$outputDir").!
  (outputDir ** "*.css").get
}

sourceGenerators in Assets += sassTask.taskValue

说明

假设您在app/assets/<whatever>目录中有sass文件，并且想在web/public/main/<whatever>目录中创建css文件，那么您可以这样做.

Explanation

Assuming you have sass file in a app/assets/<whatever> directory, and that you want to create css files in web/public/main/<whatever> directory, this is what you could do.

创建一个任务，该任务将读取app/assets/<whatever>目录和子目录中的文件，并将其输出到我们定义的sassOutputDir.

Create a task, which will read in files in the app/assets/<whatever> directory and subdirectories, and output them to our defined sassOutputDir.

val sassTask = taskKey[Seq[File]]("Compiles Sass files")

val sassOutputDir = settingKey[File]("Output directory for Sass generated files")

sassOutputDir := target.value / "web" / "sass" / "main"

resourceDirectories in Assets += sassOutputDir.value

sassTask := {
  val sourceDir = (sourceDirectory in Assets).value
  val outputDir = sassOutputDir.value
  val sourceFiles = (sourceDir ** "*.scss").get
  Seq("sass", "--update", s"$sourceDir:$outputDir").!
  (outputDir ** "*.css").get
}

但这还不够.如果要保留目录结构，则必须将sassOutputDir添加到resourceDirectories in Assets.这是因为sbt-web中的映射是这样声明的:

This is not enough though. If you want to keep the directory structure you have to add your sassOutputDir to the resourceDirectories in Assets. This is because mappings in sbt-web are declared like this:

mappings := {
  val files = (sources.value ++ resources.value ++ webModules.value) ---
    (sourceDirectories.value ++ resourceDirectories.value ++ webModuleDirectories.value)
  files pair relativeTo(sourceDirectories.value ++ resourceDirectories.value ++ webModuleDirectories.value) | flat
}

表示所有未映射的文件都使用 alternative flat策略.但是，解决方法很简单，只需将其添加到您的build.sbt

which means that all unmapped files are mapped using an alternative flat strategy. However the fix for it is simple, just add this to your build.sbt

resourceDirectories in Assets += sassOutputDir.value

这将确保目录结构得以保留.

This will make sure the directory structure is preserved.

这篇关于通过“激活器运行"运行时，获取资产进行编译.进行中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！