1

我正在使用 webpack 编译我的 rails 应用程序并在日志中出现错误。它与使用 react-bootstrap 相关,但我试图弄清楚如何解决这个重复十几次或更多次的错误。

我在 webpack-dev-server 和 web 服务器日志中得到错误。它似乎没有引起任何功能问题。这一切都只是css废话。

我需要知道如何通过使警告静音或修复代码冲突来使警告消失

WARNING in ./node_modules/bootstrap/dist/css/bootstrap.min.css (./node_modules/css-loader??ref--5-1!./node_modules/postcss-loader/src??ref--5-2!./node_modules/bootstrap/dist/css/bootstrap.min.css)
19:01:15 webpack-dev-server.1 | Module Warning (from ./node_modules/postcss-loader/src/index.js):
19:01:15 webpack-dev-server.1 | Warning
19:01:15 webpack-dev-server.1 | 
19:01:15 webpack-dev-server.1 | (6:9806) Custom property ignored: not scoped to the top-level :root element (.g-4,.gx-4 { ... --bs-gutter-x: ... })
19:01:15 webpack-dev-server.1 |  @ ./node_modules/bootstrap/dist/css/bootstrap.min.css 2:26-144 53:4-74:5 56:18-136
19:01:15 webpack-dev-server.1 |  @ ./app/javascript/CommonComponents/UploadWidget/index.js
19:01:15 webpack-dev-server.1 |  @ ./app/javascript/Project/Components/App.js
19:01:15 webpack-dev-server.1 |  @ ./app/javascript/Project/index.js
19:01:15 webpack-dev-server.1 |  @ ./app/javascript/packs/project.js

这是我的 package.json 文件供参考:

{
  "name": "timelord",
  "private": true,
  "dependencies": {
    "@babel/core": "^7.14.6",
    "@babel/preset-env": "^7.14.7",
    "@babel/preset-react": "^7.14.5",
    "@rails/webpacker": "^5.4.0",
    "@reach/router": "^1.2.1",
    "@sentry/browser": "^5.10.2",
    "axios": "^0.21.1",
    "babel-eslint": "^7.2.3",
    "babel-loader": "^8.2.2",
    "babel-plugin-syntax-dynamic-import": "^6.18.0",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "babel-plugin-transform-object-rest-spread": "^6.26.0",
    "bootstrap": "^5.1.1",
    "classnames": "^2.2.6",
    "css-loader": "^1.0.1",
    "css-what": "^5.0.1",
    "eslint": "^4.19.1",
    "eslint-config-prettier": "^2.9.0",
    "eslint-config-react-app": "^2.1.0",
    "eslint-plugin-flowtype": "^2.49.3",
    "eslint-plugin-import": "^2.19.1",
    "eslint-plugin-jsx-a11y": "^5.1.1",
    "eslint-plugin-prettier": "2.6.0",
    "eslint-plugin-react": "^7.17.0",
    "eslint-plugin-react-hooks": "^1.7.0",
    "get-youtube-id": "^1.0.1",
    "glob-parent": "^6.0.0",
    "lodash": "^4.17.15",
    "moment": "^2.22.2",
    "node-sass": "^6.0.1",
    "normalize-url": "^6.1.0",
    "object-to-formdata": "^1.6.4",
    "popper.js": "^1.16.0",
    "postcss-cssnext": "^3.1.0",
    "prettier": "1.16.3",
    "prop-types": "^15.7.2",
    "qs": "^6.9.1",
    "query-string": "^6.9.0",
    "react": "^16.12.0",
    "react-bootstrap": "^1.6.3",
    "react-dom": "^16.12.0",
    "react-dropzone": "^7.0.1",
    "react-facebook-login": "^4.1.1",
    "react-iframe": "^1.8.0",
    "react-redux": "^7.2.5",
    "react-router-dom": "^5.1.2",
    "react-stripe-elements": "^6.0.1",
    "react-toastify": "^8.0.2",
    "react-transition-group": "^2.9.0",
    "react-youtube": "^7.13.1",
    "redux": "^4.0.4",
    "redux-batched-actions": "^0.4.1",
    "redux-devtools": "^3.4.1",
    "redux-thunk": "^2.3.0",
    "smoothscroll-polyfill": "^0.4.4",
    "uuid": "^3.4.0",
    "webpack-serve": "^4.0.0"
  },
  "devDependencies": {
    "postcss-loader": "^3.0.0",
    "webpack": "^4.46.0",
    "webpack-cli": "^4.8.0",
    "webpack-dev-server": "^4.2.0"
  },
  "prettier": {
    "jsxSingleQuote": true,
    "singleQuote": true,
    "jsxBracketSameLine": false,
    "printWidth": 80,
    "trailingComma": "es5",
    "semi": true
  },
  "babel": {
    "presets": [
      "@babel/preset-env",
      "@babel/preset-react"
    ]
  },
  "engines": {
    "node": "14.17.1",
    "npm:": "6.14.4"
  },
  "resolutions": {
    "glob-parent": "5.1.2",
    "css-what": "5.0.1",
    "normalize-url": "4.5.1"
  },
  "scripts": {
    "preinstall": "npm install --package-lock-only --ignore-scripts && npx npm-force-resolutions"
  }
}
4

0 回答 0