Версии:
stylus: 0.54.5
stylus-loader: 3.0.2
webpack: 4.30.0
Структура папок:
src
|_ css
|_ base
|_ _vars.styl
|_ another.styl
|_ js
|_ some
|_ some.js => (It has "import './some.styl'")
|_ some.styl
import 'base/_vars.styl'
отлично работает в some.js
работает;
Он также отлично работает при импорте в файл another.styl
. @import 'base/_vars.styl'
Однако, он не работает внутри some.styl
. Я должен использовать относительный путь, чтобы он работал @import '../../css/base/_vars.styl'
Конфигурации Webpack:
const paths = {
css: path.join(__dirname, '../src/css/'),
javascript: path.join(__dirname, '../src/js'),
};
// module.rules for stylus loader
{
loader: 'stylus-loader',
options: {
sourceMap: !IS_PRODUCTION,
preferPathResolver: 'webpack' // Doesn't make any difference
},
}
const resolve = {
extensions: [
'.webpack-loader.js',
'.web-loader.js',
'.loader.js',
'.js',
'.jsx',
'.styl', // Doesn't make any difference
'.css', // Doesn't make any difference
],
modules: ['node_modules', paths.javascript, paths.css],
};
Примечание: Импорт файлов JS и css из каталогов разрешений прекрасно работает в файле JS.
Интересен тот же конфиг вебпака для sass-loader
, работает нормально. Что мне не хватает?