2

我正在使用这个带有jQ​​uery 外观的jQuery 模态对话框插件。它一直在工作，直到我决定使用scala-bundler从Webpack更改。Webpack 生成的捆绑包自定义 Javascript 不包含模式对话框脚本。可能是这个模态对话框库不兼容 Webpack，但我不知道，因为我不熟悉 Webpack。如何让我的项目生成包含模式对话框的最终包？请指教。谢谢jsDependencies

查看模态对话框脚本，我想我只需要在加载时执行模态对话框脚本，它就会将自己附加到$. 我创建的 jQuery 外观应该保持不变。不幸的是，我不知道如何使用 Scala.js。

我已经包括了我的一部分build.sbt 

  lazy val server = (project in file("server")).settings(commonSettings).settings(
  scalaJSProjects := Seq(client),
  pipelineStages in Assets := Seq(scalaJSPipeline),
  compile in Compile := ((compile in Compile) dependsOn scalaJSPipeline).value,
  libraryDependencies ++= Seq(
    "com.typesafe.akka" %% "akka-http" % "10.1.1",
    "com.typesafe.akka" %% "akka-stream" % "2.5.11",
    "com.vmunier" %% "scalajs-scripts" % "1.1.2"
  ),
  WebKeys.packagePrefix in Assets := "public/",
  managedClasspath in Runtime += (packageBin in Assets).value)
  .enablePlugins(SbtWeb, JavaAppPackaging, WebScalaJSBundlerPlugin)
  .dependsOn(sharedJvm)

lazy val client = (project in file("client")).settings(commonSettings).settings(
  libraryDependencies ++= Seq(
    "org.scala-js" %%% "scalajs-dom" % "0.9.5",
    "org.querki" %%% "jquery-facade" % "1.2",
    "org.querki" %%% "querki-jsext" % "0.8",
    "com.lihaoyi" %%% "upickle" % "0.6.5",
    "com.lihaoyi" %%% "utest" % "0.6.3" % "test"),
  scalaJSUseMainModuleInitializer := true,
  skip in packageJSDependencies := false,
  npmDevDependencies in Compile ++= Seq(
    "webpack-merge" -> "4.1.2",
    "imports-loader" -> "0.8.0",
    "expose-loader" -> "0.7.5"),     
  npmDependencies in Compile ++= Seq(
    "jquery" -> "2.2.1",
    "jquery-modal" -> "0.9.1"))
  .enablePlugins(ScalaJSBundlerPlugin, ScalaJSWeb)
  .dependsOn(sharedJs)

更新 1

jQuery插件在我使用自定义$暴露后设法看到，如下所示。但是，我必须在 HTML 页面中使用. 如何在 ScalaJS 中包含和执行插件并避免HTML 页面中的标签？jQuerywebpack.config.js<script ...><script>

const webpack = require('webpack')

module.exports = {
module: {
    rules: [
        // any other rules
        {
            // Exposes jQuery for use outside Webpack build
            test: require.resolve('jquery'),
            use: [{
                loader: 'expose-loader',
                options: 'jQuery'
            },{
                loader: 'expose-loader',
                options: '$'
            }]
        }
    ]
},
plugins: [
    // Provides jQuery for other JS bundled with Webpack
    new webpack.ProvidePlugin({
        $: 'jquery',
        jQuery: 'jquery'
    })
]
}

更新 2

闲置了几个月后，几天前我又拿起了它。最后，我通过 scalajs-bundler 让它与 Webpack 一起工作。

单击此处获取解决方案。

4

0 回答 0