我正在使用 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"
}
}