尝试为Angular 2集成实体化时出错

时间:2017-06-19 08:49:59

标签: angular typescript compiler-errors sass materialize

我的项目由Cli生成,使用Webpack,Typescript和Scss

以下是我得到的错误:

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

编辑:

我按照以下步骤安装了Materialise:

https://www.npmjs.com/package/angular2-materialize

用: 安装&在使用Angular CLI创建的项目中配置angular2-materialize 使用webpack安装和配置angular2-materialize

我还添加了以下资源: http://materializecss.com/getting-started.html

这里的信息是我的AngularCli配置:

{
  "$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": {
    }
  }
}

编辑2:

如果我删除“弹出”:来自angular-cli.json,我没有更多的错误。但我不明白为什么?

0 个答案:

没有答案