使用es6写页面,编译成es5,引入之后提示exports is not defined

Question

es6的写法
import './library/jquery-1.11.3.min.js';
import './library/vue-2.2.6.min.js';
export default {

el: '.login-box',
data() {
    return {
        email: '',
        password: ''
    };
},
methods: {
    login() {
        const self = this;
        if (!self.email || !self.password) {
            alert('请填写完整登录信息');
            return;
        }
        $.ajax({
            type: "POST",
            url: "/index.php/backend/login_validate",
            data: {
                name: self.email,
                password: self.password
            },
            dataType: "json",
            success: function (data) {
                if (data.error_code) {
                    alert(data.msg);
                } else {
                    window.location.href = "/index.php/backend/index";
                }
            }
        });
    }
}

}

编译之后es5的文件

'use strict';

Object.defineProperty(exports, "__esModule", {

value: true

});

require('./library/jquery-1.11.3.min.js');

require('./library/vue-2.2.6.min.js');

exports.default = {

el: '.login-box',
data: function data() {
    return {
        email: '',
        password: ''
    };
},

methods: {
    login: function login() {
        var self = this;
        if (!self.email || !self.password) {
            alert('请填写完整登录信息');
            return;
        }
        $.ajax({
            type: "POST",
            url: "/index.php/backend/login_validate",
            data: {
                name: self.email,
                password: self.password
            },
            dataType: "json",
            success: function success(data) {
                if (data.error_code) {
                    alert(data.msg);
                } else {
                    window.location.href = "/index.php/backend/index";
                }
            }
        });
    }
}

};
//# sourceMappingURL=login.js.map

引入页面居然报错

Answer 1

babel将import/export转换为CommonJS规范的语法，只能通过webpack等基于Node的工具来打包，浏览器原生不支持CommonJS

Answer 2

这样试试?

    import $ from './library/jquery-1.11.3.min.js';
    import Vue from './library/vue-2.2.6.min.js';

Answer 3

dablwow80 正解

Answer 4

dablwow80 正解