My project is generated by Cli, using Webpack, Typescript and Scss
Here is the error i'm getting :
main.scss:1 Uncaught TypeError: __webpack_require__(...) is not a function at Object../node_modules/css-loader/index.js?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/index.js?{"ident":"postcss"}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/assets/scss/main.scss (main.scss:1) at __webpack_require__ (bootstrap caa32b6…:54) at Object../src/assets/scss/main.scss (main.scss?f95c:4) at __webpack_require__ (bootstrap caa32b6…:54) at Object.0 (styles.bundle.js:63) at __webpack_require__ (bootstrap caa32b6…:54) at webpackJsonpCallback (bootstrap caa32b6…:25) at styles.bundle.js:1 ./node_modules/css-loader/index.js?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/index.js?{"ident":"postcss"}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/assets/scss/main.scss @ main.scss:1 __webpack_require__ @ bootstrap caa32b6…:54 ./src/assets/scss/main.scss @ main.scss?f95c:4 __webpack_require__ @ bootstrap caa32b6…:54 0 @ styles.bundle.js:63 __webpack_require__ @ bootstrap caa32b6…:54 webpackJsonpCallback @ bootstrap caa32b6…:25 (anonymous) @ styles.bundle.js:1 app.component.scss:1 ----- Uncaught TypeError: __webpack_require__(...) is not a function at Object../src/app/app.component.scss (app.component.scss:1) at __webpack_require__ (bootstrap caa32b6…:54) at Object../src/app/app.component.ts (app.component.ts:6) at __webpack_require__ (bootstrap caa32b6…:54) at Object../src/app/app.module.ts (app.component.ts:8) at __webpack_require__ (bootstrap caa32b6…:54) at Object../src/main.ts (environment.ts:10) at __webpack_require__ (bootstrap caa32b6…:54) at Object.1 (main.ts:11) at __webpack_require__ (bootstrap caa32b6…:54) ./src/app/app.component.scss @ app.component.scss:1 __webpack_require__ @ bootstrap caa32b6…:54 ./src/app/app.component.ts @ app.component.ts:6 __webpack_require__ @ bootstrap caa32b6…:54 ./src/app/app.module.ts @ app.component.ts:8 __webpack_require__ @ bootstrap caa32b6…:54 ./src/main.ts @ environment.ts:10 __webpack_require__ @ bootstrap caa32b6…:54 1 @ main.ts:11 __webpack_require__ @ bootstrap caa32b6…:54 webpackJsonpCallback @ bootstrap caa32b6…:25 (anonymous) @ main.bundle.js:1
EDIT :
I installed Materialize by following the steps here :
https://www.npmjs.com/package/angular2-materialize
with : Installing & configuring angular2-materialize in projects created with the Angular CLI and Installing and configuring angular2-materialize with webpack
also I added the sass resources from : http://materializecss.com/getting-started.html
For information here is my AngularCli config :
{ "$schema": "./node_modules/@angular/cli/lib/config/schema.json", "project": { "name": "projectName", "ejected": true }, "apps": [ { "root": "src", "outDir": "dist", "assets": [ "assets", "favicon.ico" ], "index": "index.html", "main": "main.ts", "polyfills": "polyfills.ts", "test": "test.ts", "tsconfig": "tsconfig.app.json", "testTsconfig": "tsconfig.spec.json", "prefix": "app", "styles": [ "assets/scss/main.scss", "../node_modules/materialize-css/dist/css/materialize.css" ], "scripts": [ "../node_modules/jquery/dist/jquery.js", "../node_modules/hammerjs/hammer.js", "../node_modules/materialize-css/dist/js/materialize.js" ], "environmentSource": "environments/environment.ts", "environments": { "dev": "environments/environment.ts", "preprod": "environments/environment.preprod.ts", "prod": "environments/environment.prod.ts" } } ], "e2e": { "protractor": { "config": "./protractor.conf.js" } }, "lint": [ { "project": "src/tsconfig.app.json" }, { "project": "src/tsconfig.spec.json" }, { "project": "e2e/tsconfig.e2e.json" } ], "test": { "karma": { "config": "./karma.conf.js" } }, "defaults": { "styleExt": "scss", "component": { } } }
Edit 2 :
If I delete "ejected": true from the angular-cli.json I have no more error. But I don't understand why ?
/src/assets/scss/main.scss
what does it contain in line no. 1 . Why are you using css version of materialize instead ofmaterialize.scss
to styles – Vamshi Jun 19 '17 at 9:16