node.js：webpack：Babel：给出未知替换“ BODY”

Question

我是node.js的新手。 下面是我运行“ npm run build-web”（运行“ webpack --progress”并复制结果）时得到的结果。 任何帮助将不胜感激。

子centerPin：哈希值：92640a144e27eefff6af时间：1663ms生成于：02/28/2019 5:07:50 PM 1资产入口点centerPin = centerPin.bundle.js [0] ./src/screens/resources/web/lib/centerPin。 js 5.83 KiB {0} [内置] [失败] [1错误]

 WARNING in configuration The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 

“生产”以启用每个环境的默认设置。 您也可以将其设置为“ none”以禁用任何默认行为。 了解更多信息： https : //webpack.js.org/concepts/mode/

 ERROR in ./src/screens/resources/web/lib/centerPin.js Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: Unknown substitution "BODY" given at Object.keys.forEach.key (/home/accent/code/treecheckerapp/app/treeChecker/node_modules/@babel/template/lib/populate.js:35:15) at Array.forEach (<anonymous>) at populatePlaceholders (/home/accent/code/treecheckerapp/app/treeChecker/node_modules/@babel/template/lib/populate.js:33:31) 

这是我的package.json：

{   "name": "treeChecker",   "version": "0.0.1",   "private": true,   "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest",
    "build": "webpack",
    "build-web": "webpack --progress && cp -r \"./src/screens/resources/web\" \"./android/app/src/main/assets\"",
    "android-linux": "react-native bundle --platform android --dev false --entry-file index.android.js --bundle-out put android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res && react-native run-and roid",
    "bundle": "react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output and roid/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res",
    "android-linux-rel": "react-native bundle --platform android --dev false --entry-file index.android.js --bundle
-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res && react-native run
-android --variant=release"   },   "dependencies": {
    "axios": "^0.18.0",
    "lodash": "^4.17.4",
    "npm-check-updates": "^2.15.0",
    "react": "16.8.3",
    "react-native": "0.58.5",
    "react-native-autocomplete-input": "^3.4.0",
    "react-native-button-component": "^0.2.28",
    "react-native-elements": "^1.1.0",
    "react-native-fs": "^2.8.1",
    "react-native-image-picker": "^0.28.0",
    "react-native-localization": "^2.1.0",
    "react-native-offline": "^4.3.0",
    "react-native-progress": "^3.4.0",
    "react-native-router-flux": "^4.0.0-beta.21",
    "react-native-simple-compass": "^1.0.0",
    "react-native-simple-dialogs": "^1.1.0",
    "react-native-spinkit": "^1.1.1",
    "react-native-static-server": "^0.4.1",
    "react-native-toast-native": "^1.2.1",
    "react-native-vector-icons": "^6.3.0",
    "react-native-viewpager": "^0.2.13",
    "react-native-webview-messaging": "^1.1.0",
    "react-navigation": "^3.3.2",
    "react-redux": "^6.0.1",
    "redux": "^4.0.1",
    "redux-persist": "^5.10.0",
    "redux-thunk": "^2.2.0"   },   "devDependencies": {
    "async": "^2.6.2",
    "babel-core": "^6.26.3",
    "babel-jest": "24.1.0",
    "babel-loader": "^8.0.5",
    "babel-preset-env": "^1.6.0",
    "babel-preset-react-native": "4.0.1",
    "eslint-config-rallycoding": "^3.2.0",
    "html-webpack-inline-source-plugin": "0.0.10",
    "html-webpack-plugin": "^3.2.0",
    "jest": "24.1.0",
    "path": "^0.12.7",
    "react-test-renderer": "16.8.3",
    "webpack": "^4.29.6",
    "webpack-cli": "^3.2.3"   },   "jest": {
    "preset": "react-native"   } }

这是我的webpack.config.js

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const HtmlWebpackInlineSourcePlugin = require('html-webpack-inline-source-plugin');

module.exports = [
  {
    name: "createAOI",
    entry: {
      createAOI: './src/screens/resources/web/lib/createAOI.js',
    },
    output: {
      path: path.join(__dirname, 'src/screens/resources/web/'),
      filename: 'createAOI.bundle.js',
    },
    module: {
      rules: [{
        test: /\.js$/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: [
              ['env', {
                targets: {
                  browsers: ['last 2 versions', 'safari >= 9.3']
                }
              }]
            ]
          }
        }
      }]
    },
    plugins: [
      new HtmlWebpackPlugin({
        template: './src/screens/resources/web/createAOI.tpl.html',
        inlineSource: 'createAOI.bundle.js',
        filename: 'createAOI.html',
        cache: false,
      }),
      new HtmlWebpackInlineSourcePlugin(),
    ]
  },
  {
    name: "baseMap",
    entry: {
      baseMap: './src/screens/resources/web/lib/baseMap.js',
    },
    output: {
      path: path.join(__dirname, 'src/screens/resources/web/'),
      filename: 'baseMap.bundle.js',
    },
    module: {
      rules: [{
        test: /\.js$/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: [
              ['env', {
                targets: {
                  browsers: ['last 2 versions', 'safari >= 9.3']
                }
              }]
            ]
          }
        }
      }]
    },
    plugins: [
      new HtmlWebpackPlugin({
        template: './src/screens/resources/web/baseMap.tpl.html',
        inlineSource: 'baseMap.bundle.js',
        filename: 'baseMap.html',
        cache: false,
      }),
      new HtmlWebpackInlineSourcePlugin(),
    ]
  },
  {
    name: "centerPin",
    entry: {
      centerPin: './src/screens/resources/web/lib/centerPin.js',
    },
    output: {
      path: path.join(__dirname, 'src/screens/resources/web/'),
      filename: 'centerPin.bundle.js',
    },
    module: {
      rules: [{
        test: /\.js$/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: [
              ['env', {
                targets: {
                  browsers: ['last 2 versions', 'safari >= 9.3']
                }
              }]
            ]
          }
        }
      }]
    },
    plugins: [
      new HtmlWebpackPlugin({
        template: './src/screens/resources/web/centerPin.tpl.html',
        inlineSource: 'centerPin.bundle.js',
        filename: 'centerPin.html',
        cache: false,
      }),
      new HtmlWebpackInlineSourcePlugin(),
    ]
  },
]

Answer 1

通常，当某些babel插件或预设的版本与babel core不同时，会出现此错误。 尝试将其更新为相同版本。

https://github.com/babel/babel/issues/7801