webpack3.5.5 babel es2015中的import()语法错误

时间:2017-08-27 06:08:41

标签: javascript import webpack

我正在逐步编码this webpack 3.5.5 documentation。但是当我来到这里时,我总是收到这样的错误信息:

enter image description here

我假设webpack 3.5.5支持import()语法,不是吗,如果没有,会不会让es2015支持将它转换为ES5?

这是index.js:

function getComponent(){
   return import(/* webpackChunkName: "lodash" */ 'lodash').then(_ => {
     var element = document.createElement('div');

     element.innerHTML = _.join(['Hello', 'webpack'], ' ');

     return element;

   }).catch(error => 'An error occurred while loading the component');
}
getComponent().then(component => {
   document.body.appendChild(component);
 })

webpack.config.js

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
//const webpack = require('webpack');

module.exports = {
  entry: {
      app:'./src/index.js',
      //another:"./src/another_module.js"      
  },
  devtool:'inline-source-map',
  devServer:{
      contentBase:'./dist',

  },
  plugins:[      
      new HtmlWebpackPlugin({
          title:"Code Splitting"
      }),
      //new webpack.optimize.CommonsChunkPlugin({
      //    name:'common'
     // })
  ],
  output: {
    filename: '[name].bundle.js',
    chunkFilename:'[name].bundle.js',
    path: path.resolve(__dirname, 'dist')
  }  ,
   module:{
        loaders:[
            {
                test:/\.js$/,
                exclude:/node_modules/,
                loader:"babel-loader",
                query:{ 
                       presets: ['es2015']
                },
            },   
            {
                test: /\.css$/,
                use: ['style-loader', 'css-loader']
            }                
        ]
    },

};

的package.json:

{
  "name": "mypractise",
  "version": "1.0.0",
  "description": "",
  "main": "webpack.config.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "watch": "webpack --watch",
    "start": "webpack-dev-server --open",
    "build": "webpack  --display-modules"
  },
  "devDependencies": {
    "babel": "^6.23.0",
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-es2015": "^6.24.1",
    "clean-webpack-plugin": "^0.1.16",
    "css-loader": "^0.28.5",
    "file-loader": "^0.11.2",
    "html-webpack-plugin": "^2.30.1",
    "lodash": "^4.17.4",
    "style-loader": "^0.18.2",
    "webpack": "^3.5.5",
    "webpack-dev-server": "^2.7.1",
    "xml-loader": "^1.2.1"
  },
  "author": "",
  "license": "ISC"
}

0 个答案:

没有答案