bundle without scalajs-bundler

Author: cornerman

.gitignore

@@ -46,4 +46,4 @@ bin/
 
 #general
 *.class
-/node_modules
+node_modules

README.md

@@ -14,10 +14,10 @@ Terraform deployment:
 
 ## Requirements
 
-- aws-cli
 - sbt
 - yarn
 - node (>= 10.13.0)
+- aws-cli
 - terraform (>= 1.0.0): https://www.terraform.io/downloads.html
 
 ## Development
@@ -33,11 +33,6 @@ Changing any source file will automatically recompile and hot-reload the website
 
 To know more about the details, have a look at [dev.sh](dev.sh)
 
-If you just want to develop on your frontend without any backend:
-```sh
-sbt devf
-```
-
 #### Infos about webapp
 
 Webpack configuration: `webapp/webpack.config.dev.js`, `webapp/webpack.config.prod.js`
@@ -94,7 +89,7 @@ aws route53 get-hosted-zone --id $HOSTED_ZONE_ID | jq ".DelegationSet.NameServer
 First build the application:
 
 ```sh
-sbt prod
+./prod.sh
 ```
 
 Then go into the terraform directory. Set your `AWS_PROFILE`. And run terraform:

build.sbt

@@ -21,54 +21,36 @@ lazy val commonSettings = Seq(
 )
 
 lazy val jsSettings = Seq(
-  webpack / version   := "4.46.0",
-  useYarn             := true,
   scalaJSLinkerConfig ~= { _.withOptimizer(false) },
   scalaJSLinkerConfig ~= { _.withModuleKind(ModuleKind.CommonJSModule) },
   libraryDependencies += "org.portable-scala" %%% "portable-scala-reflect" % "1.1.2",
+  externalNpm         := {
+    sys.process.Process("yarn", baseDirectory.value).!
+    baseDirectory.value
+  },
 )
 
-def readJsDependencies(baseDirectory: File, field: String): Seq[(String, String)] = {
-  val packageJson = ujson.read(IO.read(new File(s"$baseDirectory/package.json")))
-  packageJson(field).obj.mapValues(_.str.toString).toSeq
-}
-
 lazy val webapp = project
   .enablePlugins(
     ScalaJSPlugin,
-    ScalaJSBundlerPlugin,
-    ScalablyTypedConverterPlugin,
+    ScalablyTypedConverterExternalNpmPlugin,
   )
   .dependsOn(api)
   .settings(commonSettings, jsSettings)
   .settings(
-    libraryDependencies              ++= Seq(
+    libraryDependencies            ++= Seq(
       "io.github.outwatch"   %%% "outwatch"            % versions.outwatch,
       "io.github.fun-stack"  %%% "fun-stack-web"       % versions.funStack,
       "io.github.fun-stack"  %%% "fun-stack-web-tapir" % versions.funStack, // this pulls in scala-java-time, which will drastically increase the javascript bundle size. Remove if not needed.
       "com.github.cornerman" %%% "colibri-router"      % versions.colibri,
       "io.suzaku"            %%% "boopickle"           % versions.boopickle,
     ),
-    Compile / npmDependencies        ++= readJsDependencies(baseDirectory.value, "dependencies") ++ Seq(
-      "snabbdom"               -> "github:outwatch/snabbdom.git#semver:0.7.5", // for outwatch, workaround for: https://github.com/ScalablyTyped/Converter/issues/293
-      "reconnecting-websocket" -> "4.1.10",                                    // for fun-stack websockets, workaround for https://github.com/ScalablyTyped/Converter/issues/293 https://github.com/cornerman/mycelium/blob/6f40aa7018276a3281ce11f7047a6a3b9014bff6/build.sbt#74
-      "jwt-decode"             -> "3.1.2",                                     // for fun-stack auth, workaround for https://github.com/ScalablyTyped/Converter/issues/293 https://github.com/cornerman/mycelium/blob/6f40aa7018276a3281ce11f7047a6a3b9014bff6/build.sbt#74
-    ),
-    stIgnore                         ++= List(
+    stIgnore                       ++= List(
       "reconnecting-websocket",
       "snabbdom",
       "jwt-decode",
     ),
-    Compile / npmDevDependencies     ++= readJsDependencies(baseDirectory.value, "devDependencies"),
-    scalaJSUseMainModuleInitializer   := true,
-    webpackDevServerPort              := 12345,
-    webpackDevServerExtraArgs         := Seq("--color"),
-    startWebpackDevServer / version   := "3.11.3",
-    fullOptJS / webpackEmitSourceMaps := true,
-    fastOptJS / webpackEmitSourceMaps := true,
-    fastOptJS / webpackBundlingMode   := BundlingMode.LibraryOnly(),
-    fastOptJS / webpackConfigFile     := Some(baseDirectory.value / "webpack.config.dev.js"),
-    fullOptJS / webpackConfigFile     := Some(baseDirectory.value / "webpack.config.prod.js"),
+    scalaJSUseMainModuleInitializer := true,
   )
 
 // shared project which contains api definitions.
@@ -87,13 +69,12 @@ lazy val api = project
 lazy val lambda = project
   .enablePlugins(
     ScalaJSPlugin,
-    ScalaJSBundlerPlugin,
-    ScalablyTypedConverterPlugin,
+    ScalablyTypedConverterExternalNpmPlugin,
   )
   .dependsOn(api)
   .settings(commonSettings, jsSettings)
   .settings(
-    libraryDependencies              ++= Seq(
+    libraryDependencies ++= Seq(
       "io.github.fun-stack" %%% "fun-stack-lambda-ws-event-authorizer" % versions.funStack,
       "io.github.fun-stack" %%% "fun-stack-lambda-ws-rpc"              % versions.funStack,
       "io.github.fun-stack" %%% "fun-stack-lambda-http-rpc"            % versions.funStack,
@@ -102,27 +83,14 @@ lazy val lambda = project
       "io.suzaku"           %%% "boopickle"                            % versions.boopickle,
       "com.lihaoyi"         %%% "pprint"                               % versions.pprint,
     ),
-    Compile / npmDependencies        ++= readJsDependencies(baseDirectory.value, "dependencies"),
-    stIgnore                         ++= List(
+    stIgnore            ++= List(
       "aws-sdk",
     ),
-    Compile / npmDevDependencies     ++= readJsDependencies(baseDirectory.value, "devDependencies"),
-    fullOptJS / webpackEmitSourceMaps := true,
-    fastOptJS / webpackEmitSourceMaps := true,
-    fastOptJS / webpackConfigFile     := Some(baseDirectory.value / "webpack.config.dev.js"),
-    fullOptJS / webpackConfigFile     := Some(baseDirectory.value / "webpack.config.prod.js"),
   )
 
-addCommandAlias("prod", "fullOptJS/webpack")
-addCommandAlias("prodf", "webapp/fullOptJS/webpack")
-addCommandAlias("prodb", "lambda/fullOptJS/webpack")
-addCommandAlias("dev", "devInitAll; devWatchAll; devDestroyFrontend")
-addCommandAlias("devf", "devInitFrontend; devWatchFrontend; devDestroyFrontend") // compile only frontend
-addCommandAlias("devb", "devInitBackend; devWatchBackend")                       // compile only backend
-addCommandAlias("devInitBackend", "lambda/fastOptJS/webpack")
-addCommandAlias("devInitFrontend", "webapp/fastOptJS/startWebpackDevServer; webapp/fastOptJS/webpack")
-addCommandAlias("devInitAll", "devInitFrontend; devInitBackend")
-addCommandAlias("devWatchFrontend", "~; webapp/fastOptJS")
-addCommandAlias("devWatchBackend", "~; lambda/fastOptJS")
-addCommandAlias("devWatchAll", "~; lambda/fastOptJS; webapp/fastOptJS")
-addCommandAlias("devDestroyFrontend", "webapp/fastOptJS/stopWebpackDevServer")
+addCommandAlias("prod", "fullOptJS")
+addCommandAlias("prodf", "webapp/fullOptJS")
+addCommandAlias("prodb", "lambda/fullOptJS")
+addCommandAlias("dev", "~; lambda/fastOptJS; webapp/fastOptJS")
+addCommandAlias("devf", "~; webapp/fastOptJS")
+addCommandAlias("devb", "~; lambda/fastOptJS")

dev.sh

@@ -28,19 +28,31 @@ prefix() (
   awk -v prefix="$colored_prefix" '{ print prefix $0; system("") }'
 )
 
+(cd lambda && yarn install && npx webpack \
+    bundle \
+    --watch \
+    --config webpack.config.dev.js \
+    | prefix "WEBPACK_BACKEND" 4 & \
+)
+
+(cd webapp && yarn install && npx webpack \
+    serve \
+    --port $PORT_FRONTEND \
+    --config webpack.config.dev.js \
+    | prefix "WEBPACK_FRONTEND" 4 & \
+)
+
 yarn install
 
 npx fun-local-env \
     --auth $PORT_AUTH \
     --ws $PORT_WS \
     --http $PORT_HTTP \
-    --http-api lambda/target/scala-2.13/scalajs-bundler/main/lambda-fastopt.js httpApi \
-    --http-rpc lambda/target/scala-2.13/scalajs-bundler/main/lambda-fastopt.js httpRpc \
-    --ws-rpc lambda/target/scala-2.13/scalajs-bundler/main/lambda-fastopt.js wsRpc \
-    --ws-event-authorizer lambda/target/scala-2.13/scalajs-bundler/main/lambda-fastopt.js wsEventAuth \
+    --http-api lambda/target/dev/main.js httpApi \
+    --http-rpc lambda/target/dev/main.js httpRpc \
+    --ws-rpc lambda/target/dev/main.js wsRpc \
+    --ws-event-authorizer lambda/target/dev/main.js wsEventAuth \
     | prefix "BACKEND" 4 &
 
 sbt dev shell
 printf "\n"
-
-

lambda/package.json

@@ -3,6 +3,9 @@
     "aws-sdk": "2.1135.0"
   },
   "devDependencies": {
-    "@fun-stack/fun-pack": "0.2.0"
+    "@fun-stack/fun-pack": "0.2.2",
+    "typescript": "4.3",
+    "webpack": "4.46.0",
+    "webpack-cli": "^4.9.2"
   }
 }

lambda/webpack.config.dev.js

@@ -1,4 +1,7 @@
 const {lambdaDev} = require('@fun-stack/fun-pack');
 
 // https://github.com/fun-stack/fun-pack
-module.exports = lambdaDev();
+module.exports = lambdaDev({
+  entrypoint: "target/scala-2.13/lambda-fastopt/main.js",
+  outputDir: "target/dev/"
+});

lambda/webpack.config.prod.js

@@ -1,4 +1,7 @@
 const {lambdaProd} = require('@fun-stack/fun-pack');
 
 // https://github.com/fun-stack/fun-pack
-module.exports = lambdaProd();
+module.exports = lambdaProd({
+  entrypoint: "target/scala-2.13/lambda-opt/main.js",
+  outputDir: "target/dist/"
+});