Question

我正在尝试使用blueprintjs，所以我按照这一行跟着教程：

main.sass

@import "~@blueprintjs/core";

但是我的webpack-dev-server给了我这个错误日志：

ERROR in ./node_modules/css-loader?{"minimize":false}!./node_modules/postcss-loader/lib?{"sourceMap":true}!./node_modules/resolve-url-loader!./node_modules/sass-loader/lib/loader.js?{"sourceMap":true}!./app/javascript/packs/main.sass
Module build failed:
 */
  ^
      Invalid CSS after " */": expected 1 selector or at-rule, was '"use strict";'
      in <redacted>/node_modules/@blueprintjs/core/dist/index.js (line 6, column 4)
webpack: Failed to compile.

所以我很困惑，为什么它试图将一个index.js文件解析为css中的sass！

关注./config/webpack/loaders/sass.js，我没有碰过：

const ExtractTextPlugin = require('extract-text-webpack-plugin')
const { env } = require('../configuration.js')

module.exports = {
  test: /\.(scss|sass|css)$/i,
  use: ExtractTextPlugin.extract({
    fallback: 'style-loader',
    use: [
      { loader: 'css-loader', options: { minimize: env.NODE_ENV === 'production' } },
      { loader: 'postcss-loader', options: { sourceMap: true } },
      'resolve-url-loader',
      { loader: 'sass-loader', options: { sourceMap: true } }
    ]
  })
}

我只看到它试图读取sass，scss和css文件。我缺少或应该检查的任何想法？

Answer 1

您收到错误，因为在postgresql-x64-9.6文件中您正在导入JS模块。 main.sass解析为~@blueprintjs/core，因此您在此过程中混入了JS。

您应该看到node_modules/@blueprintjs/core/dist/index.js文件夹包含哪些文件，并且只能导入blueprintjs/core/dist文件以进行构建。

Answer 2

您只需要在App.css文件中添加以下代码

@import "~@blueprintjs/core/dist/blueprint.css";

为什么我的webpack在编译.sass文件时会尝试加载.js文件？

2 个答案: