我正在逐步编码this webpack 3.5.5 documentation。但是当我来到这里时,我总是收到这样的错误信息:
我假设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"
}