Stylus 语法 - 导入从哪里来？

Question

我有一个名为“quasar.styl”的文件：

@import './quasar.variables'
@import '~quasar-styl'

当它被 webpack 使用 styl-loader 处理时，我收到以下错误：

failed to locate @import file ~quasar-styl.styl

我有这种感觉，关于手写笔有些东西我不明白。它会在哪里寻找文件“~quasar-style”？

该文件来自一个正在运行的样板类星体应用程序，并且应用程序目录中的任何位置都没有调用的文件quasar-style，尤其是node_modules，这是我收集波浪号告诉它要查看的地方。

有任何想法吗？

更新：我在这里上传了类星体样板项目： https ://repl.it/@jmbldwn/Quasar-Boilerplate-2

它无法在 repl.it 上运行，因为它需要 quasar-cli，但您可以在那里看到它生成的所有文件。

Answer 1

我正在使用 vue3 + vite + quasar 运行后将 quasar 添加到项目时出现同样的问题

vue add quasar

我只是注释掉这两行（可能是vue cli自动添加的，这是不正确的）

在样式/quasar.variables.sass

//@import '~quasar-variables-styl'

并在 styles/quasar.sass 中

// @import '~quasar-styl'

然后将 quasar main sass import 添加到 main.js

import "quasar/dist/quasar.sass"

我得到了修复。

Answer 2

我刚刚解决了这个问题，当我$ npm install在新的克隆中运行时发生了这个问题，然后是$ npm update，然后是$ vue upgrade。

注意：我已经安装了Quasar的Vue CLI Quasar Plugin版本，我的quasar.js配置文件以

import Vue from 'vue';
import '@/styles/quasar.styl';

解决方案

1. 在您的文件中，删除应靠近底部的src/styles/quasar.variables.styl行。@import '~quasar-variables-styl'

2. 在您的src/styles/quasar.styl文件中，将该行替换@import '~quasar-styl'为@import '~quasar/dist/quasar.styl'.