小编nil*_*nxp的帖子

PostCSS Loader 已使用与 API 模式不匹配的选项对象进行初始化

将反应脚本从版本 4 升级到版本 5 后,我遇到了这个问题!


我使用 custom-cra 和以下选项:

module.exports = override(
  addLessLoader({
    lessOptions: {
      javascriptEnabled: true,
      modifyVars: {
        '@primary-color': '#038fde',
      },
    },
  }),
  useBabelRc(),
);
Run Code Online (Sandbox Code Playgroud)
ERROR in ./src/styles/wieldy.less (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[9].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[9].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[1].oneOf[9].use[3]!./node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[9].use[4]!./src/styles/wieldy.less)

Module build failed (from ./node_modules/postcss-loader/dist/cjs.js):
ValidationError: Invalid options object. PostCSS Loader has been initialized using an options object that does not match the API schema.
 - options has an unknown property 'plugins'. These properties are valid:
   object { postcssOptions?, execute?, sourceMap?, implementation? }
    at validate (C:\Workspace\harv-Harvest-frontend\node_modules\schema-utils\dist\validate.js:105:11)
    at Object.getOptions (C:\Workspace\harv-Harvest-frontend\node_modules\webpack\lib\NormalModule.js:580:19)
    at Object.loader …
Run Code Online (Sandbox Code Playgroud)

reactjs cra

6
推荐指数
1
解决办法
1万
查看次数

CRA 项目节点 v14.17.0 - 加载 PostCSS“postcss-preset-env”插件失败:找不到模块“node:vm”

尝试启动使用节点 14.17.0 运行的 CRA 项目时出现以下错误 -> 加载 PostCSS“postcss-preset-env”插件失败:找不到模块“node:vm”

编译有问题:X

./src/app.css 中的错误 (./node_modules/css-loader/dist/cjs.js??ruleSet 1 .rules[0].oneOf[5].use 1 !./node_modules/postcss-loader/dist /cjs.js??ruleSet 1 .rules[0].oneOf[5].use[2]!./src/app.css)

模块错误(来自./node_modules/postcss-loader/dist/cjs.js):加载PostCSS“postcss-preset-env”插件失败:找不到模块“node:vm”需要堆栈:

  • /Users/niltonxd/Workspace/harv-Harvest-frontend/node_modules/@csstools/postcss-trigonometric-functions/dist/index.cjs
  • /Users/niltonxd/Workspace/harv-Harvest-frontend/node_modules/postcss-preset-env/dist/index.cjs
  • /Users/niltonxd/Workspace/harv-Harvest-frontend/node_modules/postcss-loader/dist/utils.js
  • /Users/niltonxd/Workspace/harv-Harvest-frontend/node_modules/postcss-loader/dist/index.js
  • /Users/niltonxd/Workspace/harv-Harvest-frontend/node_modules/postcss-loader/dist/cjs.js
  • /Users/niltonxd/Workspace/harv-Harvest-frontend/node_modules/loader-runner/lib/loadLoader.js
  • /Users/niltonxd/Workspace/harv-Harvest-frontend/node_modules/loader-runner/lib/LoaderRunner.js
  • /Users/niltonxd/Workspace/harv-Harvest-frontend/node_modules/webpack/lib/NormalModule.js
  • /Users/niltonxd/Workspace/harv-Harvest-frontend/node_modules/webpack-manifest-plugin/dist/index.js
  • /Users/niltonxd/Workspace/harv-Harvest-frontend/node_modules/react-scripts/config/webpack.config.js
  • /Users/niltonxd/Workspace/harv-Harvest-frontend/node_modules/react-app-rewired/overrides/webpack.js
  • /Users/niltonxd/Workspace/harv-Harvest-frontend/node_modules/react-app-rewired/scripts/start.js

(@/Users/niltonxd/Workspace/harv-Harvest-frontend/src/app.css)

{
  "name": "harvest-front",
  "version": "1.7.4",
  "private": true,
  "dependencies": {
    "@ant-design/icons": "^4.7.0",
    "@fortawesome/fontawesome-svg-core": "^1.2.22",
    "@fortawesome/free-solid-svg-icons": "^5.10.2",
    "@fortawesome/react-fontawesome": "^0.1.4",
    "@types/jest": "^27.4.1",
    "@types/node": "^17.0.23",
    "@types/react": "^17.0.43",
    "@types/react-dom": "^17.0.14",
    "antd": "^4.18.7",
    "apexcharts": "^3.19.2",
    "apisauce": "^1.1.0",
    "connected-react-router": "^6.5.2",
    "dotenv": "^10.0.0",
    "formik": "^2.2.9",
    "har-validator": "^5.1.5",
    "history": "4.10.1",
    "js-file-download": "^0.4.9",
    "leaflet": "^1.7.1",
    "lodash": "^4.17.21", …
Run Code Online (Sandbox Code Playgroud)

reactjs postcss-loader cra

5
推荐指数
1
解决办法
9572
查看次数

当条件满足时获取 yup 的当前值

我有两个日期字段,开始日期和结束日期。我想知道如何设置验证以不接受开始日期高于结束日期,反之亦然。

阅读 yup 文档我看到了when 条件,但它只是从其他字段获取值!

提交日期

import { date, object } from 'yup';

export const yupSchema = object({
  startAt: date().typeError('Invalid date').nullable(),
  endAt: date().typeError('Invalid date').nullable(),
});

Run Code Online (Sandbox Code Playgroud)

html validation reactjs yup react-hook-form

3
推荐指数
1
解决办法
7891
查看次数

标签 统计

reactjs ×3

cra ×2

html ×1

postcss-loader ×1

react-hook-form ×1

validation ×1

yup ×1