0

Is there any way to load component specific js and css in angular 6 currently I have bootstrap theme with common css and js now in some case I have to add js for specific page let say I want to load js for login page but that js is not used in other components so how can I do this

Currently I am following angular.json file to add js and css for the project like this

 "styles": [
       "src/styles.css",
        "src/assets/user/app-assets/css/bootstrap.css",
        "src/assets/user/app-assets/fonts/icomoon.css",
        "src/assets/user/app-assets/fonts/flag-icon-css/css/flag-icon.min.css",
        "src/assets/user/app-assets/vendors/css/extensions/pace.css",
        "src/assets/user/app-assets/css/bootstrap-extended.css",
        "src/assets/user/app-assets/css/app.css",
        "src/assets/user/app-assets/css/colors.css",
        "src/assets/user/app-assets/css/core/colors/palette-gradient.css",
        "src/assets/user/assets/css/style.css",

        ],
        "scripts": [
        "src/assets/user/app-assets/js/core/libraries/jquery.min.js", 
        "src/assets/user/app-assets/vendors/js/ui/tether.min.js",
        "src/assets/user/app-assets/js/core/libraries/bootstrap.min.js",
        "src/assets/user/app-assets/vendors/js/ui/perfect-scrollbar.jquery.min.js",
        "src/assets/login/js/owl.carousel.js",
        "src/assets/user/app-assets/js/core/app.js",
        "src/assets/login/js/demo.js",
        ]
ASF
  • 64
  • 11
  • rule number 1: don't use any dom lib next to angular, because angular does everything you need. For bootstrap: https://stackoverflow.com/questions/43758400/what-is-the-difference-between-ng-bootstrap-and-ngx-bootstrap the css you can set in your component specific css files. I also would recommend you to use SCSS as i do in my templates like: https://github.com/JohnnyDevNull/ng-three-template/tree/master/src/styles there you import the basics in your main.scss and do the comp specific stuff in the components scss files. – JohnnyDevNull Oct 16 '18 at 11:50
  • @JohnnyDevNull please can you explain if i want 1 js to be loaded on login and not on any other pages so if i add that js in angular.json it will be loaded every time –  Oct 17 '18 at 03:24
  • 1
    because you can use angular and vanilla js, thats component specific in your maybe `LoginComponent`. Angular is a full features frontend framework, so there are no needs to use jquery. – JohnnyDevNull Oct 17 '18 at 05:42

0 Answers0