如何将TypeScript,SASS和串联集成到我的Play项目中?

时间:2016-01-21 11:25:39

标签: playframework sass typescript requirejs sbt-concat

以下是我所拥有的:

  • 用TypeScript
  • 编写的客户端应用程序逻辑
  • 我的SASS样式表
  • 各种第三方组件及其自己的普通JS和CSS

我希望将所有内容构建到单个JS文件和单个CSS文件中。我需要能够指定包含来自我的TS文件的JS的顺序。我的目录结构是标准的Play with:

.
├── app
│   ├── assets
│   │   └── js
│   │       ├── build.ts
│   │       ├── components
│   │       │   └── test.ts
│   │       ├── messaging.ts
│   │       ├── main.ts
│   │       └── vue.d.ts
└── public
    ├── css
    │   └── *.css
    ├── dashboard
    │   ├── assets
    │   │   └── <some component>
    │   │       ├── *.css
    │   │       └── *.min.js
    ├── fonts
    │   └── *.{otf,svg,ttf,woff,woff2}
    ├── images
    │   └── *.{jpg.png}
    └── js
        └── *.min.js

我安装了sbt-typescriptsbt-rjs,这是在标准build.sbt的末尾:

JsEngineKeys.engineType := JsEngineKeys.EngineType.Node

TypescriptKeys.moduleKind in TypescriptKeys.typescript := "amd"

pipelineStages := Seq(rjs)

//RjsKeys.appDir := file(".")
RjsKeys.mainConfig := "build"
RjsKeys.mainModule := "main"

build.ts看起来像这样:

({
    baseUrl: ".",
    paths: {
    },
    name: "main",
    out: "main-built.js"
})

在我的HTML中,我有:

<script data-main="@routes.Assets.versioned("js/main.js")" type="text/javascript" src="@routes.Assets.versioned("lib/requirejs/require.js")"></script>

它们都拼凑在一起(我之前从未使用过TypeScript或RequireJS),但它似乎适用于开发和生产版本中的TypeScript位。 (我还没有添加SASS。)

如果到目前为止这是正确的方法,那么将所有其他内容合并到一起以便它仍然适用于开发和生产的正确方法是什么?我是否为RequireJS编写了另一个构建配置文件,还是应该使用sbt-concat

0 个答案:

没有答案