angular-cli.json - webpack의 스크립트 포함, 위젯의 jquery

나는 jhipster-project가 있습니다. 나는 그것에 adminLTE를 통합하려고합니다. 대부분의 것을 달성했습니다. 내가 adminLTE 프로젝트 구조를 볼 때 여기angular-cli.json - webpack의 스크립트 포함, 위젯의 jquery

는, 각-cli.json은 다음 항목 내 webpack.dev.js에서

"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"]

을 포함, 나는이 스크립트와 CSS를 포함 할 수있는 방법을 찾기 위해 노력하고있다.

나는 JQuery와

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

거기 이미 나는 내가 이러한 스크립트의 사용이 내가 가지고있는 파일을 만들 경우이

alias: { 
       'morris.js': '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 co nfig. 또한 앵귤러 cli에 사용 된 CSS를 프로젝트에 어떻게 추가해야합니까?

package.json에서 원사 webpack : build가 webpack/webpack.dev.js 설정을 트리거합니다. 여기에서 생각한 것은 파일이지만, 방법은 확실하지 않습니다.

출처

2017-09-08 Mayurb

네 .. 맞습니다! 효과가있었습니다. 고마워요 !! scripts.js가 브라우저에서로드되고 중단 점에 도달하는 것을 볼 수 있습니다. script.js에서 또 다른 문제가 발생합니다. 여기에는 다음 코드가 포함되어 있습니다.

jQuery.widget.bridge ('uibutton', jQuery.ui.button);

//은 레이아웃

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

를 업데이트 타이프 라이터 코드에서 전화를받을 그것은 정의의 특성 '다리'를 읽을 수 없습니다 말했다. 이 문제를 어떻게 해결해야합니까? 위젯은 Jquery에 있습니다.

감사합니다. 또한, 나는 jhipster의 빌드 체인에 대해 읽을 수있는 ..

다시 감사합니다 .. 정보는 비트 만과 pieces..it 시간 디버깅이 많이 걸립니다! .. 감사

출처

2017-09-09 05:50:40 Mayurb

angular-cli.json - webpack의 스크립트 포함, 위젯의 jquery

답변

관련 문제