angular-cli: Angular-cli-webpack 3rd party scripts or styles are not loading

Hi,

Following those instructions, I’ve been trying to add in the global scope bootstrap. In order to do this, I changed my angular-cli.json this way :

{
  "project": {
    "version": "1.0.0-beta.11-webpack.2",
    "name": "rose"
  },
  "apps": [
    {
      "main": "src/main.ts",
      "styles": [
        "../node_modules/bootstrap/dist/css/bootstrap.min.css"
      ],
      "scripts": [
        "../node_modules/bootstrap/dist/js/bootstrap.min.js"
      ],
      "tsconfig": "src/tsconfig.json",
      "mobile": false
    }
  ],
  "addons": [],
  "packages": [],
  "e2e": {
    "protractor": {
      "config": "config/protractor.conf.js"
    }
  },
  "test": {
    "karma": {
      "config": "config/karma.conf.js"
    }
  },
  "defaults": {
    "prefix": "app",
    "sourceDir": "src",
    "styleExt": "css",
    "prefixInterfaces": false,
    "lazyRoutePrefix": "+"
  }
}

But it does not get loaded… I’ve been spending a day on finding why it does not work (I have of course bootstrap installed (bootstrap 3 via npm)

Also here is my angular-cli version : angular-cli: 1.0.0-beta.11-webpack.2 node: 4.4.7 os: darwin x64

Any help would be much welcome

About this issue

Original URL
State: closed
Created 8 years ago
Reactions: 5
Comments: 15 (1 by maintainers)

Most upvoted comments

Having the same problem for angular-cli: 1.2.3 node: 8.1.2 os: linux x64

Bootstrap Styles and Scripts are not loading.

+18

lauritowal on Jul 22, 2017

I’m having the same issue after updating to v1.0.0-beta.11-webpack.8 from 1.0.0-beta.11-webpack.2 scripts are now working but styles are not

{ "project": { "version": "1.0.0-beta.11-webpack.2", "name": "master-mind" }, "apps": [ { "main": "src/main.ts", "tsconfig": "src/tsconfig.json", "mobile": false, "scripts":[ "../node_modules/jquery/dist/jquery.js", "../node_modules/tether/dist/js/tether.js", "../node_modules/bootstrap/dist/js/bootstrap.js" ], "styles":[ "src/main.scss", "../node_modules/bootstrap/dist/css/bootstrap.css" ] } ], "addons": [], "packages": [], "e2e": { "protractor": { "config": "config/protractor.conf.js" } }, "test": { "karma": { "config": "config/karma.conf.js" } }, "defaults": { "prefix": "app", "sourceDir": "src", "styleExt": "scss", "prefixInterfaces": false, "lazyRoutePrefix": "+" } }

Ardenexal on Sep 8, 2016

It’s done :

Error: Cannot find module './models/config'
    at Function.Module._resolveFilename (module.js:455:15)
    at Function.Module._load (module.js:403:25)
    at Module.require (module.js:483:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/Users/eric/Documents/projects/hubup-projects/hubup-upgrade-center-webapp/node_modules/angular-cli/addon/ng2/index.js:4:16)
    at Module._compile (module.js:556:32)
    at Object.Module._extensions..js (module.js:565:10)
    at Module.load (module.js:473:32)
    at tryModuleLoad (module.js:432:12)
    at Function.Module._load (module.js:424:3)

With node.js version 6.5.0 . I can’t even make a ng serve with it 😦

echap on Aug 30, 2016