使用 laravel 运行 npm 时出现节点错误

Question

我在运行npm run dev或运行时遇到此错误，但npm run watch我没有发现是什么乱七八糟的。它发生在全新的 Laravel 8 应用程序中。

当我使用开发命令时看起来会发生

ERROR in ./resources/css/app.css
Module build failed (from ./node_modules/css-loader/index.js):
ModuleBuildError: Module build failed (from ./node_modules/postcss-loader/src/index.js):
TypeError: [(...variantsValue),(...extensions)].flat is not a function
    at /var/www/html/smart_recipe/node_modules/tailwindcss/lib/util/resolveConfig.js:219:73
    at baseMergeDeep (/var/www/html/smart_recipe/node_modules/lodash/_baseMergeDeep.js:42:7)
    at /var/www/html/smart_recipe/node_modules/lodash/_baseMerge.js:27:7
    at /var/www/html/smart_recipe/node_modules/lodash/_createBaseFor.js:17:11
    at baseMerge (/var/www/html/smart_recipe/node_modules/lodash/_baseMerge.js:24:3)
    at /var/www/html/smart_recipe/node_modules/lodash/mergeWith.js:36:3
    at /var/www/html/smart_recipe/node_modules/lodash/_createAssigner.js:30:9
    at apply (/var/www/html/smart_recipe/node_modules/lodash/_apply.js:15:25)
    at /var/www/html/smart_recipe/node_modules/lodash/_overRest.js:32:12
    at mergeVariantExtensions (/var/www/html/smart_recipe/node_modules/tailwindcss/lib/util/resolveConfig.js:218:33)
    at resolveVariants (/var/www/html/smart_recipe/node_modules/tailwindcss/lib/util/resolveConfig.js:235:10)
    at resolveConfig (/var/www/html/smart_recipe/node_modules/tailwindcss/lib/util/resolveConfig.js:271:15)
    at /var/www/html/smart_recipe/node_modules/tailwindcss/lib/index.js:77:37
    at /var/www/html/smart_recipe/node_modules/tailwindcss/lib/processTailwindFeatures.js:52:20
    at LazyResult.run (/var/www/html/smart_recipe/node_modules/postcss/lib/lazy-result.js:288:14)
    at LazyResult.asyncTick (/var/www/html/smart_recipe/node_modules/postcss/lib/lazy-result.js:212:26)
    at LazyResult.asyncTick (/var/www/html/smart_recipe/node_modules/postcss/lib/lazy-result.js:225:14)
    at /var/www/html/smart_recipe/node_modules/postcss/lib/lazy-result.js:217:17
    at runLoaders (/var/www/html/smart_recipe/node_modules/webpack/lib/NormalModule.js:316:20)
    at /var/www/html/smart_recipe/node_modules/loader-runner/lib/LoaderRunner.js:367:11
    at /var/www/html/smart_recipe/node_modules/loader-runner/lib/LoaderRunner.js:233:18
    at context.callback (/var/www/html/smart_recipe/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
    at Promise.resolve.then.then.catch (/var/www/html/smart_recipe/node_modules/postcss-loader/src/index.js:208:9)
 @ ./resources/css/app.css

Answer 1

我遇到了同样的问题，花了 5 个小时寻找解决方案，但没有。经过大量搜索，我遇到了这个

“Tailwind CSS v2.0 不再支持 Node.js 8 或 10。要构建 CSS，您需要确保在本地和 CI 环境中运行 Node.js 12.13.0 或更高版本。”

在 https://tailwindcss.com/docs/upgrading-to-v2

所以我意识到问题出在我的 Node 版本 10.x 中，所以我从我的 Windows 机器上卸载了 Node 并下载了 LTS 版本 (14.x)。所以考虑更新你的 Node 版本，它会解决这个问题，因为它对我有用。有可能旧节点版本没有 Tailwind CSS 2 已实现的平面功能，这会引发错误。