Question

我正在尝试将材质设计精简版包含在我的Angular 2.0（最终）项目中（使用webpack）。我正在使用此设置：

我从Angular Webpack Starter
在vendor.browser.ts
将src / app / app.style.css重命名为* scss
使用this guide来处理scss文件
向app.style.scss添加了几个导入（变量，mixins等，根据此guide）
将以下内容添加到webpack.common.js

sassLoader = {
  includePaths: [
    path.resolve(
      __dirname,
      "./node_modules/material-design-lite/src")
  ]
};

在npm开始时，我收到一条错误消息，指出app.component.scss中的变量无法找到。更具体地说，我收到以下错误消息：

ERROR in ./src/app/app.style.scss 
Module build failed: 
@import "variables"; 
^ 
   File to import not found or unreadable: variables 
Parent style sheet: stdin 
   in d:\Project Files\<full-path>\src\app\app.style.scss (line 4, column 1)
@ ./src/app/app.component.ts 25:21-48 
@ ./src/app/app.module.ts 
@ ./src/app/index.ts 
@ ./src/main.browser.ts 
@ multi main

看起来最后一步（包括webpack的路径）不起作用，但是我不知道如何解决这个问题。

Answer 1

正如TeoMatthew所指出的，webpack配置文件位于项目根目录的子目录中，因此需要使用＆＃39; ../'引用webpack中的root，如下所示：

path.resolve(__dirname, '../node_modules/normalize-scss/sass')

在Angular2中包含Material Design Lite（MDL）

1 个答案: