我正在MDN 文档上学习 JavaScript 的事件循环 。它提到队列中的消息会运行到完成，但最后它说事件循环永远不会被阻塞。我实在不明白这一点。这不是矛盾吗？请帮助我理解它们之间的区别。
“运行至完成”
每条消息都会在处理任何其他消息之前完成处理。在推理程序时，这提供了一些很好的属性，包括每当函数运行时，它都不能被抢占，并且将在任何其他代码运行之前完全运行（并且可以修改函数操作的数据）。这与 C 不同，例如，如果一个函数在线程中运行，则运行时系统可能会在任何时候停止它以在另一个线程中运行其他代码。
此模型的缺点是，如果消息需要很长时间才能完成，Web 应用程序将无法处理单击或滚动等用户交互。浏览器通过“脚本运行时间太长”对话框来缓解这种情况。遵循的一个好习惯是缩短消息处理时间，如果可能的话将一条消息削减为多条消息。
永不阻塞
事件循环模型的一个非常有趣的属性是，与许多其他语言不同，JavaScript 永远不会阻塞。处理 I/O 通常是通过事件和回调执行的，因此当应用程序等待 IndexedDB 查询返回或 XHR 请求返回时，它仍然可以处理其他事务，例如用户输入。
当我在汇总中使用 Scss 时，当我构建项目时出现错误：
[!] Error: Unexpected character '@' (Note that you need plugins to import files that are not JavaScript)
components/styles/index.scss (3:0)
1: @import 'variables';
我尝试了一些方法但没有成功，例如rollup-plugin-postcss或rollup-plugin-scss。我改为sass，node-sass但出现了另一个问题，因为我使用了类似的语法$spacer / 2。
这是我的 package.json
[!] Error: Unexpected character '@' (Note that you need plugins to import files that are not JavaScript)
components/styles/index.scss (3:0)
1: @import 'variables';
这是index.scss
"devDependencies": {
"@babel/core": "^7.18.6",
"@babel/preset-env": "^7.18.6",
"@babel/preset-react": "^7.18.6",
"@babel/preset-typescript": "^7.18.6",
"@rollup/plugin-babel": "^5.3.1",
"@rollup/plugin-commonjs": "^22.0.1",
"@rollup/plugin-json": "^4.1.0",
"@rollup/plugin-node-resolve": …