如何从 SBT 运行 webpack

Posted 2023-03-24

【中文标题】如何从 SBT 运行 webpack

【英文标题】：How do I run webpack from SBT

【发布时间】：2016-04-06 16:47:29

【问题描述】：

我正在开发一个 Play 2.4 应用程序，并希望 SBT 在编译期间运行 webpack 以生成静态资源。

我尝试了https://github.com/stejskal/sbt-webpack，但它似乎对我不起作用。

【参考方案1】：

我通过定义一个自定义 sbt 任务来让它工作，该任务用于依赖于您打包应用程序时调用的 dist 和 stage 任务。

任务的代码很简单：

lazy val webpack = taskKey[Unit]("Run webpack when packaging the application")

  def runWebpack(file: File) = 
    Process("webpack", file) !
  

  webpack := 
    if(runWebpack(baseDirectory.value) != 0) throw new Exception("Something goes wrong when running webpack.")
  

  dist <<= dist dependsOn webpack

  stage <<= stage dependsOn webpack

在开发模式下，当代码更改时，我使用play action hooks 运行webpack watch：

PlayKeys.playRunHooks <+= baseDirectory.map(Webpack.apply)

用Webpack定义如下：

import java.net.InetSocketAddress
import play.sbt.PlayRunHook
import sbt._

object Webpack 
  def apply(base: File): PlayRunHook = 
    object WebpackHook extends PlayRunHook 
      var process: Option[Process] = None

      override def beforeStarted() = 
        process = Option(
          Process("webpack", base).run()
        )
      

      override def afterStarted(addr: InetSocketAddress) = 
        process = Option(
          Process("webpack --watch", base).run()
        )
      

      override def afterStopped() = 
        process.foreach(_.destroy())
        process = None
      
    

    WebpackHook
  

它就像一个魅力。您可以在我的 github 帐户中找到使用此技术的示例游戏项目：https://github.com/nouhoum/play-react-webpack/blob/master/webpack.sbt

我希望这会有所帮助；-)

【参考方案2】：

在我更新到 SBT 1.0.x 之前，Nouhoum 的回答运行良好

只需要一些更新：

import scala.sys.process.Process

lazy val webpack = taskKey[Unit]("Run webpack when packaging the application")

def runWebpack(file: File) = 
  Process("npm run build", file) !


webpack := 
  if(runWebpack(baseDirectory.value) != 0) throw new Exception("Something went wrong when running webpack.")


dist := (dist dependsOn webpack).value

stage := (stage dependsOn webpack).value

【参考方案3】：

我们构建了sbt-webpack，它与带有 Playframework 静态资产的增量编译干净地集成在一起。我希望你想要什么。 sbt run 和 sbt stage 可以正常工作。

在GIVE.asia，我们使用它来将Vue、Axios 和Vue-i18 打包成一个单独的JS 文件，然后将其包含在我们的html 文件中。然后，我们使用expose-loader 公开变量Vue、VueI18n 和axios。

首选sbt-webpack 的原因是它将输出文件生成到Playframework 路由可以使用的适当位置。因为它与 Playframework 的静态资源的增量编译集成。

这里是回购：https://github.com/GIVESocialMovement/sbt-webpack

或者您可以直接跳转到一个工作示例：https://github.com/GIVESocialMovement/sbt-webpack/tree/master/test-play-project

【讨论】：

您的插件未找到依赖项。我在 github repo 上添加了一个问题

感谢您的尝试。我认为根本原因是 scala 主要版本的任一 sbt 版本不匹配。我已经在 github issue 中回复了。让我们解决这个问题。