./node_modules/@esri/calcite-components/dist/custom-elements/index.mjs 1:0-147 中的错误

Question

我已经将它添加到我的 package.json dist/custom-elements/index.mjs": "dist/custom-elements/index.js 为什么我是有这个错误（下）。我错过了什么吗？

{
  "name": "@map/react-app",
  "private": true,
  "scripts": {
    "start": "webpack serve",
    "start:standalone": "webpack serve --port 9003 --env standalone",
    "build": "concurrently yarn:build:*",
    "build:webpack": "webpack --mode=production",
    "analyze": "webpack --mode=production --env analyze",
    "lint": "eslint src --ext js",
    "format": "prettier --write .",
    "check-format": "prettier --check .",
    "test": "cross-env BABEL_ENV=test jest",
    "watch-tests": "cross-env BABEL_ENV=test jest --watch",
    "prepare": "husky install",
    "coverage": "cross-env BABEL_ENV=test jest --coverage"
  },
  "devDependencies": {
    "@babel/core": "^7.15.0",
    "@babel/eslint-parser": "^7.15.0",
    "@babel/plugin-transform-runtime": "^7.15.0",
    "@babel/preset-env": "^7.15.0",
    "@babel/preset-react": "^7.14.5",
    "@babel/runtime": "^7.15.3",
    "@testing-library/jest-dom": "^5.14.1",
    "@testing-library/react": "^12.0.0",
    "babel-jest": "^27.0.6",
    "concurrently": "^6.2.1",
    "cross-env": "^7.0.3",
    "eslint": "^7.32.0",
    "eslint-config-prettier": "^8.3.0",
    "eslint-config-react-important-stuff": "^3.0.0",
    "eslint-plugin-prettier": "^3.4.1",
    "husky": "^7.0.4",
    "identity-obj-proxy": "^3.0.0",
    "jest": "^27.0.6",
    "jest-cli": "^27.0.6",
    "prettier": "^2.3.2",
    "pretty-quick": "^3.1.1",
    "webpack": "^5.51.1",
    "webpack-cli": "^4.8.0",
    "webpack-config-single-spa-react": "^4.0.0",
    "webpack-dev-server": "^4.0.0",
    "webpack-merge": "^5.8.0"
  },
  "dependencies": {
    "@arcgis/core": "^4.21.2",
    "@material-ui/styles": "^4.11.4",
    "@mui/styles": "^5.2.2",
    "@reach/router": "^1.3.4",
    "@stencil/core": "^2.11.0",
    "browserify": "^17.0.0",
    "dotenv": "^10.0.0",
    "dotenv-webpack": "^7.0.3",
    "path-browserify": "^1.0.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "single-spa-react": "^4.3.1",
    "web-vitals": "^2.1.2"
  },
  "lint-staged": {
    "*.{js,jsx}": "pretty-quick --staged && eslint --fix"
  },
  "browser": {
    "dist/custom-elements/index.mjs": "dist/custom-elements/index.js" // I'll already add this to may package.json, why i am having this error?
  }
}

错误

错误 ./node_modules/@esri/calcite-components/dist/custom-elements/index.mjs 1:0-147

找不到模块：错误：无法解析“@stencil/core/internal/client” 在 'C:\Users\Ronald\Desktop\Map\app-react\node_modules@esri\calcite-components\dist\custom-elements' 您的意思是“index.js”吗？重大变化：请求 '@stencil/core/internal/client' 无法解析，只是因为它是 按照完全指定的方式解析（可能是因为来源是严格的 EcmaScript 模块，例如。 G。一个带有 javascript mimetype 的模块，一个 '.mjs' 文件，或 package.json 包含“类型”的“.js”文件： “模块”'）。请求中的扩展是强制性的 完全指定。将扩展添加到请求中。

Answer 1

最好的解决方案是在您的 webpack.config.js 添加此代码

module:{
      rules:[
        {
          test: /\.m?js/,
          resolve: {
              fullySpecified: false
          }
        }
      ]
},

并删除你的 package.json 中的浏览器