Question

我正在使用npm，TypeScript和Webpack。

我可以使用 Expose Loader 来全局公开jQuery：

import "expose-loader?$!jquery"
import "expose-loader?jQuery!jquery"

然后我可以导入bootstrap：

import "bootstrap"

这允许$，jQuery和$().popover（jQuery名称空间中的boostrap函数）对外部js文件或浏览器控制台全局可见。

然而，我找不到以同样的方式公开$.ui的方法。

我试过了：

import "jquery-ui" //needs building, from 1.12 on they support importing indivisual modules
import "jquery-ui/ui"
import "jquery-ui-dist/jquery-ui.js"
import "jquery-ui-bundle" //1.12.1 and 1.11.4
import "jqueryui";

所有努力让import "jquery-ui-ouch-punch"最终导入而不会抛出错误......

Answer 1

问题中的上述示例在create-react-app的上下文中正常工作。但是在.Net应用程序的上下文中使用它在前端它没有表现。我不确定为什么，但我确实得到了这样的工作：

import $ from "jquery";
var jQuery = $;
(<any> window).$ = (<any>window).jQuery = $;
//use require so the assignments above happen, imports get hoisted
require("jquery-ui") 
require("jquery-ui-touch-punch");
require("bootstrap");

对于 jQuery-ui-touch-punch ，我必须在文件的开头添加var jQuery = require('jquery');，以使其与webpack很好地配合。我分叉它并使用基于git的npm依赖来处理这个问题。

Answer 2

我现在以这种方式工作：

%scala
import org.apache.spark.sql.functions._

val dfMod = df
  .withColumn("thedate", regexp_extract($"filepath", "[0-9][0-9][0-9][0-9]/[0-9][0-9]/[0-9][0-9]", 0) )
  .withColumn("theyear", substring($"thedate", 1, 4 ) )
  .withColumn("themonth", substring($"thedate", 6, 2 ) )
  .withColumn("theday", substring($"thedate", 9, 2 ) )
  .withColumn("thefile", regexp_extract($"filepath", "[^/]+\\.gz", 0) )


dfMod.show(false)

使用

(window as any).$ = require('jquery');
(window as any).jQuery = $;

// use require so the imports aren't hoisted above the global variable assignments.
require('jquery-ui-dist/jquery-ui');
require('imports-loader?this=>window!jquery-ui-touch-punch');

如何使用webpack全局公开$ .ui（jquery-ui）

2 个答案: