Javascript 如何将Jquery/Bootstrap文件包含到堆栈Webpack/angular2/typescript中

在我的项目中，我使用stack Webpack/angular2（带有typescript）

我试图包括boostrap和jquery的.js文件，但我找不到一个简单且解释得很好的方法

我成功地尝试使用：

• 将加载程序导入webpack.config
• 将“jquery”导入vendor-browser.ts
• 在我的ts文件中需要（“jquery”）

我可能错过了什么

我正在寻找一种通用解决方案，将.js文件包含到“窗口”对象中。文件位于node_modules文件夹中

有人能帮我吗

谢谢

一个解决方案是这个库（用于网页包）

基本示例：

---

css模块示例：

如果我理解您的意思，那么ypu希望在您的angular2项目中添加jquery和bootstrap.js

下面是我如何做的例子

添加一个插件，以便在引导之前加载jquery

new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery"
})

如果您已经用npm安装了bootstrap和jquery，那么只需将它们导入主文件即可

import "bootstrap/dist/js/bootstrap.js";
import "jquery";

现在您可以在浏览器的控制台中键入$ 它应该会告诉您有jquery加载。

答案几乎是正确的。除了使用

ProvidePlugin时，

$在浏览器控制台中不可用。这个插件所做的是用

require（jquery）

替换每个$occurrence

因此，如果您使用的是外部jquery插件，那么它将不起作用

此外，在使用此解决方案时，我建议还包括

window.jQuery

，因为某些插件仅使用这种符号

new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery",
            'window.jQuery': "jquery"
})

如果需要更多的通用解决方案，请考虑使用<代码>公开加载器< /代码>：

npm install expose-loader --save-dev

然后这个：

require("expose?$!jquery");

或网页包配置中的此权限：

loaders: [
    { test: require.resolve('jquery'), loader: 'expose?jQuery!expose?$' }
]

---

你试过我的答案吗？没有，现在没有时间…如何在代码块中包含引导css和js？'window.Jquery'应该是'window.Jquery'

loaders: [
    { test: require.resolve('jquery'), loader: 'expose?jQuery!expose?$' }
]