js模块的导入和导出如何写?

对于一些非模块化的文件如何导入并打包呢?比如jquery.

import './jquery.min.js';//直接导入即可

通常jquery或其插件都是将接口绑定到全局的,所以直接导入即可.

ES6 (ECMAScript 6.0) 写法

//calculator.js
export default{
    name:'calculator',
    add:function(a,b){return a+b;}
};
//index.js
import calculator from './calculator.js';
const sum = calculator.add(2,3);

ES6引入npm包的方式:

import _ from 'lodash';

当webpack在打包的时候,解析到这一句,就会到node_modules中寻找lodash模块.
准确到加载的哪个文件呢?其实是npm模块的入口文件,他在模块的package.json中的main字段中定义.

针对命名导出的导入写法:

import (name,add as getSum) from './calculator.js';

针对默认导出的导入写法:

import calculator from './calculator.js';
他相当于
import {default as calculator} from './calculator.js';

命名和默认都存在的写法:

import react,{Component} from 'react';

CommonJS 的写法如下:

导出模块
//calculator.js
module.exports = {
    name: 'calculator',
    add: function(a,b){return a+b;}
};
//index.js 导入模块使用
const calculator = require('./calculator.js');
const sum = calculator.add(2,3);
console.log(sum);//5