时间戳

首页 > 解决方案 > Parcel+Sass+npm：“错误：无法安装@parcel/transformer-sass：回调必须是函数。收到未定义

node.js - Parcel+Sass+npm：“错误：无法安装@parcel/transformer-sass：回调必须是函数。收到未定义

问题描述

我正在尝试使用 Parcel 构建一个库，并尝试将一个index.scss文件导入我的index.js文件中，如果我不将它作为依赖项包含它，它要么无法“安装 @parcel/transformer-sass”，要么“不能”当我安装它时找到模块“@parcel/transformer-sass”。index.css' file into 值得注意的是，如果我改为导入 index.js` ，Parcel 将成功构建。

有谁知道我做错了什么？

npm i @parcel/transformer-scss作为依赖项安装，我得到错误：

× Build failed.

Error: Failed to install @parcel/transformer-sass: Callback must be a function. Received undefined

  Error: Failed to install @parcel/transformer-sass: Callback must be a function. Received undefined
  at install
  (C:\...\nvm\v14.18.0\node_modules\parcel\node_modules\@parcel\package-manager\lib\installPackage.js:131:11)
  at processTicksAndRejections (internal/process/task_queues.js:95:5)
  at async PromiseQueue._runFn
  (C:\...\nvm\v14.18.0\node_modules\parcel\node_modules\@parcel\utils\lib\PromiseQueue.js:88:7)
  at async PromiseQueue._next
  (C:\...\nvm\v14.18.0\node_modules\parcel\node_modules\@parcel\utils\lib\PromiseQueue.js:75:5)

安装@parcel/transformer-sassand @parcel/config-default，我收到错误：

× Build failed.

@parcel/core: Cannot find Parcel plugin "@parcel/transformer-sass"

  C:\...\nvm\v14.18.0\node_modules\parcel\node_modules\@parcel\config-default\index.json:25:23
    24 |     "*.{styl,stylus}": ["@parcel/transformer-stylus"],
  > 25 |     "*.{sass,scss}": ["@parcel/transformer-sass"],
  >    |                       ^^^^^^^^^^^^^^^^^^^^^^^^^^ Cannot find module "@parcel/transformer-sass"
    26 |     "*.less": ["@parcel/transformer-less"],
    27 |     "*.{css,pcss}": ["@parcel/transformer-postcss", "@parcel/transformer-css"],

我还尝试创建.parcelrc各种配置，包括：

{
"transformers":{".scss":"@parcel/transformer-scss"}
}

和

{
"extends":"@parcel/config-default",
"transformers":{".scss":"@parcel/transformer-scss"}
}

这会引发类似的错误。

这是我的package.json：

  "name": "frontend",
  "version": "1.0.0",
  "description": "",
  "source": "src/index.js",
  "targets": {
    "default": {
      "distDir": "../staticfiles"
    }
  },
  "main": "index.js",
  "module": "module.js",
  "scripts": {
    "watch": "parcel watch",
    "build": "parcel build"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "parcel": "latest"
  },
  "dependencies": {
    "@parcel/config-default": "^2.0.0",
    "@parcel/transformer-sass": "^2.0.0",
    "@popperjs/core": "^2.10.2",
    "bootstrap": "^5.1.3",
    "bootstrap-table": "^1.18.3",
    "jquery": "^3.6.0"
  }
}

这是我的index.js：

import "./index.scss";
import 'bootstrap';
import 'bootstrap-table';
import $ from "jquery";
console.log($)


window.jQuery = $;
window.$ = $;

console.log("hello world");

$(function() {
    $('#table').bootstrapTable()
  })

这是我的index.scss：

@import "bootstrap/scss/bootstrap";
@import "bootstrap-table/dist/bootstrap-table";
// @import "bootstrap-table/dist/extenstions/filter-control/bootstrap-table-filter-control";

$body-color: slateblue;

body {
  color: $body-color;
  font-family: sans-serif;
}

标签： node.jswebpacksassparceljs

解决方案

Callback must be a function. Received undefined在具有（不相关）yarn.lock文件的父目录的项目目录中使用 parcel 时会出现问题。

要重现运行touch ~/yarn.lock，然后在~/.

要解决此问题，请删除yarn.lock父目录中的所有文件。

推荐阅读