在项目中使用了Webpack与ES6技术，但经常出现ES6文件没有编译的错误，如下：

main.js:62 Uncaught SyntaxError: Unexpected token export
   
   

    
    
1
   
   

浏览器提示export关键无法识别，显然ES文件没有被编译，依次诊断的顺序如下：

1. 确认是否存在.babelrc

如果没有在babel-loader里明确指定ES6的子集，那么系统根路径下必须包含.babelrc文件，其内容如下所示：

{  "presets": ["es2015", "stage-2"],  "plugins": ["transform-runtime"],  "comments": true}
   
   

    
    
1
    
    
2
    
    
3
    
    
4
    
    
5
   
   

需要注意的是，务必保证相关的包都安装完成，如babel-preset-stage-2、babel-plugin-transform-runtime。

2. 确认loader配置的路径是否正确

在babel-loader的配置中，include的配置路径必须是绝对路径，如下：

{    test: /\.es6$/,    loader: 'babel-loader',    //  这里必须是绝对路径    // 错误的写法 include: './es6'    include:path.resolve(__dirname, './es6')}
   
   

    
    
1
    
    
2
    
    
3
    
    
4
    
    
5
    
    
6
    
    
7
   
   

3. 确认ES6文件的后缀名是否匹配

确认ES6文件的后缀名与babel-loader的配置是否匹配，假如是以上的写法，ES6文件的后缀名必须是es6，否则将不会编译。