Babel 转换器

babel-loader

安装babel-loader，现在我们就可以放心的用ES6的语法了

npm install --save-dev babel-loader
npm install --save-dev babel-core babel-preset-es2015 //安装babel  实现 ES6 到 ES5

在webpack.config.js中添加配置项

module:{
                loaders:[{
                        test:/\.js$/,
                        exclude:/node_modules/,
                        loader:"babel-loader",
                }]
},
//ES6转ES5
babel:{
                presets:['es2015']
},

// Greeter.js
module.exports = function(){
        var greet =document.createElement('div');
        greet.textContent = "Hithere and greetings!";
        console.log("test2");
        return greet;
};

可以把上面的代码用ES6改写成下面的格式

// Greeter.js
export default functionf(){
        var greet =document.createElement('div');
        greet.textContent = "Hithere and greetings!";
        console.log("test2");
        return greet;
};

var greeter = require('./Greeter.js');//ES5
import greeter from './Greeter.js'; //ES6

export与exportdefault均可用于导出常量、函数、文件、模块等，你可以在其它文件或模块中通过import+(常量 | 函数 | 文件 |模块)名的方式，将其导入，以便能够对其进行使用，但在一个文件或模块中，export、import可以有多个，export default仅有一个

所以上面是只导出一个函数的情况，如果导出多个可以用下面这种方式

// test.js
export const str = 'hello world'
export function f(a){
    return a+1
}

import{
        str,
        f
} from './test.js';