Question

我正在按照react library的步骤来尝试实现i18n this tutorial

好的，现在当我们运行npm run build时，我们应该看到build / locales / data.json它将所有的JSON文件合并为一个。

从那时起，我无法让npm run build正常工作。我修复了一个错误，然后出现了另一个错误。我猜这是babel / webpack的问题，因为我没有经验，而且本教程中有一些我处理过的babel语法错误。

这是我的package.json

{
    "dependencies": {
    "@babel/core": "7.4.3",
    "@babel/preset-env": "^7.5.4",
    "@babel/preset-react": "^7.0.0",
    "@babel/runtime": "^7.5.4",
    "@svgr/webpack": "4.1.0",
    "@typescript-eslint/eslint-plugin": "1.6.0",
    "@typescript-eslint/parser": "1.6.0",
    "babel-eslint": "10.0.1",
    "babel-jest": "^24.8.0",
    "babel-loader": "8.0.5",
    "babel-plugin-named-asset-import": "^0.3.2",
    "babel-plugin-react-intl": "^4.1.0",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-preset-react-app": "^9.0.0",
    "bootstrap": "^4.3.1",
    "camelcase": "^5.2.0",
    "case-sensitive-paths-webpack-plugin": "2.2.0",
    "css-loader": "2.1.1",
    "dotenv": "6.2.0",
    "dotenv-expand": "4.2.0",
    "eslint": "^5.16.0",
    "eslint-config-react-app": "^4.0.1",
    "eslint-loader": "2.1.2",
    "eslint-plugin-flowtype": "2.50.1",
    "eslint-plugin-import": "2.16.0",
    "eslint-plugin-jsx-a11y": "6.2.1",
    "eslint-plugin-react": "7.12.4",
    "eslint-plugin-react-hooks": "^1.5.0",
    "file-loader": "3.0.1",
    "firebase": "^6.2.4",
    "fs-extra": "7.0.1",
    "html-webpack-plugin": "4.0.0-beta.5",
    "identity-obj-proxy": "3.0.0",
    "is-wsl": "^1.1.0",
    "jest": "24.7.1",
    "jest-environment-jsdom-fourteen": "0.1.0",
    "jest-resolve": "24.7.1",
    "jest-watch-typeahead": "0.3.0",
    "mini-css-extract-plugin": "0.5.0",
    "optimize-css-assets-webpack-plugin": "5.0.1",
    "pnp-webpack-plugin": "1.2.1",
    "postcss-flexbugs-fixes": "4.1.0",
    "postcss-loader": "3.0.0",
    "postcss-normalize": "7.0.1",
    "postcss-preset-env": "6.6.0",
    "postcss-safe-parser": "4.0.1",
    "react": "^16.8.6",
    "react-app-polyfill": "^1.0.1",
    "react-dev-utils": "^9.0.1",
    "react-dom": "^16.8.6",
    "react-intl": "^2.9.0",
    "react-router-dom": "^5.0.1",
    "reactstrap": "^8.0.1",
    "resolve": "1.10.0",
    "sass-loader": "7.1.0",
    "semver": "6.0.0",
    "style-loader": "0.23.1",
    "terser-webpack-plugin": "1.2.3",
    "ts-pnp": "1.1.2",
    "url-loader": "1.1.2",
    "webpack": "4.29.6",
    "webpack-dev-server": "3.2.1",
    "webpack-manifest-plugin": "2.0.4",
    "workbox-webpack-plugin": "4.2.0"
  },
  "devDependencies": {
    "@babel/cli": "^7.5.0",
    "@babel/node": "^7.5.0",
    "@babel/plugin-transform-runtime": "^7.5.0"
  },
  "scripts": {
    "start": "node scripts/start.js",
    "test": "node scripts/test.js",
    "build:langs": "NODE_ENV='production' babel-node scripts/mergeMessages.js",
    "build": "npm run build:langs && node scripts/build.js"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
  },
  "babel": {
    "presets": [
      "react-app",
      "@babel/preset-env",
      "@babel/preset-react"
    ],
    "passPerPreset": false,
    "plugins": [
      [
        "@babel/plugin-transform-runtime"
      ],
      [
        "react-intl",
        {
          "messagesDir": "./public/messages/"
        }
      ]
    ]
  }
}

这是错误：

/yadayada/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/defineProperty.js:1（函数（导出，需要，模块，__ filename，__ dirname）{   默认函数_defineProperty（obj，key，value）{                                                                 ^^^^^^

SyntaxError：意外的令牌导出       在createScript（vm.js：80：10）       在Object.runInThisContext（vm.js：139：10）       在Module._compile（module.js：616：28）       在Module._compile（/yadayada/node_modules/pirates/lib/index.js:99:24）       在Module._extensions..js（module.js：663：10）       在Object.newLoader [as .js]（/yadayada/node_modules/pirates/lib/index.js:104:7）       在Module.load（module.js：565：32）       在tryModuleLoad（module.js：505：12）       在Function.Module._load（module.js：497：3）       在Module.require（module.js：596：17）

Answer 1

在类似的i18n React项目中，我看到了defineProperty.js的类似模糊问题。

大约一个月前，此软件包已更新到9.0.1版。安装以前的版本对我来说解决了这个问题：

npm install babel-preset-react-app@9.0.0

Answer 2

我已经多次面对这个问题，这是我解决的方法 1-以管理员身份启动终端（或在命令前写sudo） 2-尝试清除缓存 npm缓存清除--force 3-尝试进行npm安装，希望它能工作

babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/defineProperty.js：1语法错误：在createScript（vm.js：80：10

2 个答案: