为什么我的 webpack 在编译 .sass 文件时会尝试加载 .js 文件? [英] Why is my webpack trying to load .js files when compiling a .sass file?
问题描述
我正在尝试使用 blueprintjs,所以我遵循了这一行的教程:
I'm trying to use blueprintjs so I followed the tutorial with this line:
main.sass
@import "~@blueprintjs/core";
但是我的 webpack-dev-server 给了我这个错误日志:
However my webpack-dev-server gives me this error log:
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 文件作为 sass 解析为 css!
So I'm confused why it's trying to parse an index.js file as sass into css!
看./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 文件.有什么我遗漏或应该检查的想法吗?
I only see it trying to read sass, scss and css files. Any ideas what I'm missing or should check?
推荐答案
您收到一个错误,因为在您的 main.sass
文件中您正在导入一个 JS 模块.~@blueprintjs/core
解析为 node_modules/@blueprintjs/core/dist/index.js
,因此您在此过程中混合了 JS.
You are receiving an error because in you main.sass
file you are importing a JS module. ~@blueprintjs/core
resolves to node_modules/@blueprintjs/core/dist/index.js
and thus you are getting JS mixed in the process.
您应该看到 blueprintjs/core/dist
文件夹包含哪些文件,并且只导入 sass/scss/css
文件以进行构建.
You should see what files the blueprintjs/core/dist
folder contains and only import sass/scss/css
files to make your build.
这篇关于为什么我的 webpack 在编译 .sass 文件时会尝试加载 .js 文件?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!