PostCSS не загружает зависимости модуля SCSS - PullRequest
Новая
       7

PostCSS не загружает зависимости модуля SCSS

0 голосов
/ 21 сентября 2018

Эй, накопители,

Я создаю приложение React , используя Rails вместе с Webpacker , что заставляет меняиспользовать PostCSS для загрузки стилей вместе с дополнительными другими загрузчиками поверх него.

При импорте модуля SCSS из моих пакетов, например import '@material/react-button/index';, он выглядит как PostCSS не загружает их соответствующие зависимости, так как для загрузки требуется @material/base/mixins.

Файл node_modules/@material/base/_mixins.scss находится в папке node_modules.Поэтому я действительно не могу понять, почему он не читает или не импортирует соответствующий файл.

Environment.js 

const { environment } = require('@rails/webpacker')
const path = require('path')

module: {
  rules: [{
    test: /\.js(\.erb)?$/,
    exclude: /node_modules/,
    loader: 'babel-loader',
    options: {
      presets: [
        ['env', { modules: false }]
      ]
    }
  },
  {
    test: /\.scss$/,
    use: extractSCSS.extract({
      use: [
      { loader: 'style-loader', options: { sourceMap: true } },
      { loader: 'css-loader', 
          options: { 
            sourceMap: true,
            importLoaders: 2 
          } 
      },
      { loader: 'postcss-loader', options: { sourceMap: true } },
      { loader: 'sass-loader', 
          options: { 
            sourceMap: true, 
            includePaths: ["node_modules"]
          }
      }]
    })
  }]
}

module.exports = environment

Журнал ошибок 

10:53:42 webpacker.1 | ERROR in ./node_modules/css-loader??ref--2-1!./node_modules/postcss-loader/lib??ref--2-2!./node_modules/sass-loader/lib/loader.js??ref--2-3!./node_modules/@material/react-button/index.scss
10:53:42 webpacker.1 | Module build failed:
10:53:42 webpacker.1 | @import "@material/base/mixins";
10:53:42 webpacker.1 | ^
10:53:42 webpacker.1 |       File to import not found or unreadable: @material/base/mixins.
10:53:42 webpacker.1 |       in /Users/remy/projects/kmpgny-sked-rails/node_modules/@material/ripple/common.scss (line 17, column 1)
10:53:42 webpacker.1 | Error:
10:53:42 webpacker.1 | @import "@material/base/mixins";
10:53:42 webpacker.1 | ^
10:53:42 webpacker.1 |       File to import not found or unreadable: @material/base/mixins.
10:53:42 webpacker.1 |       in /Users/remy/projects/kmpgny-sked-rails/node_modules/@material/ripple/common.scss (line 17, column 1)
10:53:42 webpacker.1 |     at options.error (/Users/remy/projects/kmpgny-sked-rails/node_modules/node-sass/lib/index.js:291:26)
10:53:42 webpacker.1 |  @ ./node_modules/@material/react-button/index.scss 2:14-161 21:1-42:3 22:19-166
10:53:42 webpacker.1 |  @ ./app/javascript/sked-app/components/App.jsx
10:53:42 webpacker.1 |  @ multi (webpack)-dev-server/client?http://localhost:3035 webpack/hot/dev-server ./app/javascript/sked-app/components/App.jsx
10:53:42 webpacker.1 | webpack: Failed to compile.
...