Postcss-extend. 'class not found'何时从文件夹中@imported文件node_modules？

Question

您好，我收到一个错误，其中扩展模块找不到位于"node_modules"目录中的导入文件中包含的类。

错误信息

error  in ./resources/assets/pcss/app.pcss
Module build failed: ModuleBuildError: Module build failed: 
@extend .relative; // fails
^
".footer" failed to @extend ".relative".
The selector ".relative" was not found.

应用程序.pcss 文件

@import '../../../node_modules/basscss-position/index.css'; /* contains .relative */
/* @import 'basscss-position/index.css';  this also fails */
@import "./test.pcss"; /* contains .bg-primary */
.footer {
@extend .bg-primary; /* works */
@extend .relative; /* fails */
}

webpack.mix.js

let mix = require('laravel-mix'); // aka webpack wrapper that makes things simple
let convertLength = require('convert-css-length');
let convert = convertLength('13px');
mix.sass('resources/assets/pcss/app.pcss', 'public/css')
.options({
postCss: [
require('postcss-import')(),
require('postcss-cssnext')({ browsers: ['last 2 versions', 'ie >= 9']}),
require('postcss-extend')()
]
})

添加到包中的脚本对象.json

script: {
"watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --
progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
}

我注意到，如果我将node_module文件从 .css 更改为 .pcss，那么它将起作用，但我不确定为什么，我真的不想这样做。

Answer 1

我过去遇到过类似的问题，问题是这不是postcss-extend的错误，你应该在postcss-import中报告这个错误，或者干脆你可以用postcss-simple-import替换你的postcss-import依赖项，它更好，并且由开发人员正确管理。