angular-cli.json -在webpack中包含脚本，在小部件中包含+ jquery

Question

我有个jhipster项目。我正在尝试将adminLTE集成到其中。已经完成了大部分工作。

在这里，当我看到adminLTE项目结构时，angular-cli.json包含以下条目

"styles": [
            "content/css/vendor.css",
            "content/css/global.css",
             "styles.css",
            "../node_modules/bootstrap/dist/css/bootstrap.css",
            "../node_modules/font-awesome/css/font-awesome.css",
            "../node_modules/ionicons/css/ionicons.css",
            "_variables.less",
            "../node_modules/icheck/skins/flat/blue.css",
            "../node_modules/morris.js/morris.css",
            "../node_modules/bootstrap-datepicker/dist/css/bootstrap-datepicker3.css",
            "../node_modules/admin-lte/plugins/daterangepicker/daterangepicker.css",
            "../node_modules/bootstrap3-wysihtml5-bower/dist/bootstrap3-wysihtml5.css"
        ],
        "scripts": [  "../node_modules/jquery/dist/jquery.js",
        "../node_modules/jqueryui/jquery-ui.js",
        "../node_modules/bootstrap/dist/js/bootstrap.js",
        "../node_modules/raphael/raphael.js",
        "../node_modules/morris.js/morris.js",
        "../node_modules/jquery-sparkline/jquery.sparkline.js",
        "../node_modules/jquery-knob/dist/jquery.knob.min.js",
        "../node_modules/moment/moment.js",
        "../node_modules/daterangepicker/daterangepicker.js",
        "../node_modules/bootstrap-datepicker/js/bootstrap-datepicker.js",
        "../node_modules/jquery-slimscroll/jquery.slimscroll.js",
        "../node_modules/bootstrap3-wysihtml5-bower/dist/bootstrap3-wysihtml5.all.js",
        "../node_modules/icheck/icheck.js",
        "../node_modules/admin-lte/dist/js/app.js",
        "assets/js/scripts.js"]

在我的webpack.dev.js中，我试图找到一种方法来包含这些脚本和css。

我看到jquery已经有了

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

我通过这样做添加了morris.js

alias: {
                'morris.js': 'morris.js/morris.js'

            }

如果我必须使用这些脚本文件，我必须手动将它们包含在component.ts中，如下所示：

import  'morris.js';
import 'jquery-knob';
import 'bootstrap-datepicker';
import 'jqueryui';
import 'daterangepicker';
import 'jquery-slimscroll';
import 'admin-lte';

有没有办法，我可以把它们加到webpack的配置里。另外，我应该如何将angular-cli中使用的CSS添加到我的项目中。

我在package.json中看到，纱线webpack:构建，触发配置webpack/webpack.dev.js.所以我想这里的文件是我必须做的，但不确定如何做。

Answer 1

是啊..你说得对！！这招奏效了。非常感谢！我可以看到scripts.js正在加载到浏览器中，并且达到了一个断点。不过，我在script.js中遇到了另一个问题。它包含以下代码。

jQuery.widget.bridge('uibutton'，jQuery.ui.button)；

//接收来自typescript代码的调用以更新布局

var AdminLTE = (function() {
  return {
    init: function() {
        jQuery(function(){
            jQuery.AdminLTE.layout.activate();
            jQuery.AdminLTE.layout.fix();
            jQuery.AdminLTE.layout.fixSidebar();
      });
    }
  }
})(AdminLTE||{});

并且它说不能读取未定义的属性'bridge‘。我应该如何解决这个问题。小部件就在Jquery中。

谢谢。另外，我可以在那里读到关于构建jhipster的链条..信息仅以位为单位，pieces..it需要花费大量时间进行调试。

再次感谢！..问候