ReferenceError: [BABEL] Unknown option: base.__esModule

Question

我正在尝试反应延迟组件加载，它将单独加载组件然后我得到

unexpected token import

我更改了我的 babel 文件，现在错误是

ReferenceError: [BABEL] E:\projectSir\latestProject1\tools\startMsg.js: Unknown option: base.__esModule. Check out http://babeljs.io/docs/usage/options/ for more info
    at Logger.error (E:\projectSir\latestProject1\node_modules\babel-core\lib\transformation\file\logger.js:43:11)
    at OptionManager.mergeOptions (E:\projectSir\latestProject1\node_modules\babel-core\lib\transformation\file\options\option-manager.js:307:20)
    at OptionManager.init (E:\projectSir\latestProject1\node_modules\babel-core\lib\transformation\file\options\option-manager.js:506:10)
    at File.initOptions (E:\projectSir\latestProject1\node_modules\babel-core\lib\transformation\file\index.js:243:89)
    at new File (E:\projectSir\latestProject1\node_modules\babel-core\lib\transformation\file\index.js:159:72)
    at Pipeline.transform (E:\projectSir\latestProject1\node_modules\babel-core\lib\transformation\pipeline.js:49:16)
    at Object.transformFileSync (E:\projectSir\latestProject1\node_modules\babel-core\lib\api\node.js:152:10)
    at compile (E:\projectSir\latestProject1\node_modules\babel-register\lib\node.js:129:20)
    at loader (E:\projectSir\latestProject1\node_modules\babel-register\lib\node.js:158:14)
    at Object.require.extensions.(anonymous function) [as .js] (E:\projectSir\latestProject1\node_modules\babel-register\lib\node.js:168:7)

我的 babel 文件是

{
"plugins": ["syntax-dynamic-import"],
"presets": ["env","react","es2015"],
"env": {
    "development": {
                                    "presets": [
                                                            "react-hmre"
                                                            ]
                                }
                }
}

我的反应代码是

async loadLazyComponent ()  {

    if(this.state.animation == null){
        try{
            const LazyComponent = await import('./animation.js')

            this.setState({animation:React.createElement(LazyComponent.default)})
        }catch(e){
            this.setState({animation:<div>`failed ${e}`</div>})
        }
    }
}

和 package.json 文件是

"babel-polyfill": "6.8.0",
    "babel-preset-env": "^1.6.1",

并且 devDependencies 是

"babel-cli": "^6.8.0",
"babel-core": "6.8.0",
"babel-loader": "6.2.4",
"babel-plugin-react-display-name": "2.0.0",
"babel-plugin-syntax-dynamic-import": "^6.18.0",
"babel-preset-es2015": "6.6.0",
"babel-preset-es2016": "^6.24.1",
"babel-preset-react": "6.5.0",
"babel-preset-react-hmre": "1.1.1",
"babel-register": "6.8.0",

和 webpack.confg.dev.js 文件是

import webpack from 'webpack';
import path from 'path';

export default {
  debug: true,
  devtool: 'inline-source-map',
  noInfo: false,
  entry: [
    'eventsource-polyfill', // necessary for hot reloading with IE
    'webpack-hot-middleware/client?reload=true', //note that it reloads the page if hot module reloading fails.
    path.resolve(__dirname, 'src/index')
  ],
  target: 'web',
  output: {
    path: __dirname + '/dist', // Note: Physical files are only output by the production build task `npm run build`.
    publicPath: '/',
    filename: 'bundle.js'
  },
  devServer: {
    contentBase: path.resolve(__dirname, 'src')
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin()
  ],
  module: {
        loaders: [
      {test: /\.js$/, include: path.join(__dirname, 'src'), exclude: /node_modules/, loaders: ['babel','babel-loader']},
      {test: /(\.css)$/, loaders: ['style', 'css']},    
            {test: /\.(jpe?g|gif|svg)$/i, loader: "file-loader?name=/public/icons/[name].[ext]"},
      {test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file'},
      {test: /\.(woff|woff2)$/, loader: 'url?prefix=font/&limit=5000'},
      {test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=application/octet-stream'},
      {test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=image/svg+xml'}
    ]
  },
    node: {
  fs: 'empty',
    child_process:'empty'
    }
};

我正处于学习阶段，如有任何帮助，我们将不胜感激。

Answer 1

**

the error was that i am using older version of webpack, upgrading it solved my issue.

** 我认为 代码拆分 是不允许的或语法 import('./someModule.js') webpack 1.X 版本不允许
现在我有 webpack 3.X 并且错误已解决

ReferenceError: [BABEL] Unknown option: base.__esModule

ReferenceError: [BABEL] Unknown option: base.__esModule

lazy-loading

reactjs

babeljs