Cannot assign to read only property ‘exports‘ of object ‘#＜Object＞‘

webpack打包的时候，可以在js文件中混用require和export。但是不能混用import 以及module.exports。
一定要配对使用import和export default，尽量配对使用require和module.exports

拓展export

1. export 加default和不加的区别

// 第一组
export default function init() { // 输出
  // 对应的import语句不需要使用大括号
  }
import init from 'init'; // 输入


// 第二组
export function init() { // 输出
  // 对应的import语句需要使用大括号
  };
import {init} from 'init'; // 输入

export default命令用于指定模块的默认输出。一个模块只能有一个默认输出，因此export default命令只能使用一次。

2.export default命令用在非匿名函数前
3.export和export default可以同时使用

export default function (obj) {  // ···}

export function init(obj, iterator, context) {  // ···}

export { init as Init};//暴露出Init接口，默认指向init 接口，即Init和init 指向同一个方法(Init 是别名)。

import defaultFunction, { init, init as Init} from 'init';

4.export default就是输出一个叫做default的变量或方法(将后面的值，赋给default变量)

export default 1

5.export default也可以用来输出类

// MyClass.js
export default class { ... }

// main.js
import MyClass from 'MyClass';
let o = new MyClass();

import用法
需要注意的是 import是在代码编辑阶段执行的，和export配套使用。

import {name, age} from './login';
import {name as otherName } from './login';
import * as otherName from "./login";

module.exports用法
1、返回一个JSON Object
写法一

var app = {
    name: 'app',
    age: '18',
    sayName: function(name){
        console.log(this.name);
    }
}
module.exports = app;

写法二

var app = {
	name: 'app',
	age: '18',
	sayName: function(name){
	    console.log(this.name);
	}
exports.sayName = sayName;

调用
var app = require('./app.js');
app.sayName('hello');//hello

2、返回一个构造函数
CLASS.js:

var CLASS = function(age){
     this.age = age;
}
module.exports = CLASS

调用
var CLASS = require('./CLASS.js');
varc = new CLASS('arguments')

3、返回一个实例对象
CLASS.js

var CLASS = function(){
    this.name = "class";
}
CLASS .prototype.func = function(){
    alert(this.name);
}
module.exports = new CLASS();

调用
var c = require('./CLASS.js');
c.func();//"class"

require.js的加载
　　require的使用非常简单，它相当于module.exports的传送门，module.exports后面的内容是什么，require的结果就是什么，对象、数字、字符串、函数……
再把require的结果赋值给某个变量，相当于把require和module.exports进行平行空间的位置重叠
　　优点：
　　　　1）实现js文件的异步加载，避免网页失去响应；
　　　　2）管理模块之间的依赖性，便于代码的编写和维护。
　　引入

　　	require('./a')(); // a模块是一个函数，立即执行a模块函数
　　　　var data = equire('./a').data; // a模块导出的是一个对象
　　　　var a = require('./a')[0]; // a模块导出的是一个数组

在vue的js引入图片，就需要使用require（“路径”）进来

注：
　　　　从理解上，require是赋值过程，import是解构过程，当然，require也可以将结果解构赋值给一组变量，但是import在遇到default时，和require则完全不同：

　　　　var $ = require('jquery');
　　　　import $ from 'jquery'

是完全不同的两种概念。
　　require和import分别使用在：
require 是赋值过程并且是运行时才执行，也就是异步加载。
require可以理解为一个全局方法，因为它是一个方法所以意味着可以在任何地方执行。
import 是解构过程并且是编译时执行。
import必须写在文件的顶部。
　　require和import的优缺点比较：
　　require的性能相对于import稍低，因为require是在运行时才引入模块并且还赋值给某个变量，而import只需要依据import中的接口在编译时引入指定模块所以性能稍高。