如何解决不是来自Webpack的内容是来自

waxmsbnn  于 2023-02-04  发布在  Webpack
关注(0)|答案(1)|浏览(136)

我添加react-app-rewired和customize-cra到我的项目。当我使用“npm start”运行我的项目时,我得到一个错误,如内容不是来自webpack是从enter image description here提供的
这是我的package.json文件

{
  "name": "geek-app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.11.4",
    "@testing-library/react": "^11.1.0",
    "@testing-library/user-event": "^12.1.10",
    "antd-mobile": "^2.3.4",
    "axios": "^0.21.1",
    "classnames": "^2.3.1",
    "dayjs": "^1.10.6",
    "dompurify": "^2.3.0",
    "formik": "^2.2.9",
    "highlight.js": "^11.1.0",
    "history": "4.10.1",
    "lodash": "^4.17.21",
    "postcss": "^7.0.39",
    "prop-types": "^15.7.2",
    "react": "^17.0.2",
    "react-content-loader": "^6.0.3",
    "react-dom": "^17.0.2",
    "react-redux": "^7.2.4",
    "react-router-dom": "^5.2.0",
    "react-scripts": "4.0.3",
    "react-window": "^1.8.6",
    "react-window-infinite-loader": "^1.0.7",
    "redux": "^4.1.0",
    "redux-devtools-extension": "^2.13.9",
    "redux-thunk": "^2.3.0",
    "sass": "^1.35.2",
    "socket.io-client": "^4.1.3",
    "web-vitals": "^1.0.1",
    "yup": "^0.32.9"
  },
  "scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "babel-plugin-import": "^1.13.3",
    "customize-cra": "^1.0.0",
    "postcss-px-to-viewport": "^1.1.1",
    "react-app-rewired": "^2.1.8"
  }
}

这是我的配置覆盖. js文件

const {
  override,
  addPostcssPlugins,
  addWebpackAlias,
  addBabelPlugins
} = require('customize-cra')
const pxToViewport = require('postcss-px-to-viewport')
const path = require('path')

const alias = addWebpackAlias({
  '@': path.resolve(__dirname, 'src'),

  '@scss': path.resolve(__dirname, 'src', 'assets', 'styles')
})

const viewport = pxToViewport({

  viewportWidth: 375

})

module.exports = override(
  addPostcssPlugins([viewport]),
  alias,
  ...addBabelPlugins(['import', { libraryName: 'antd-mobile', style: 'css' }])
)

我尝试在我的项目中添加webpack.confing.js文件,但似乎没有效果。

const path = require('path')

module.exports = {
  //...
  devServer: {
    static: {
      directory: path.join(__dirname, '/')
    },
    compress: true,
    port: 9000
  }
}
2admgd59

2admgd591#

问题已经解决了,我把我的node.js版本切换到了一个较低的级别。

相关问题