Js的module模块

js的module有必要再回顾一下

//文件尾部
export default out;
//或者
export {out1, out2, out3};

我的写法:

module.exports = {mpoint,pathplan};
module.exports=getpath;

es6的写法再次尝试. 其实依旧不行, 因为node不支持. 最后还是要用webpack.

http://web.jobbole.com/82238/

webpack打包umd.

好吧, 我承认, 我怂了, 再一次怂了, 前端打包是个大事, 我就不参与了. 我用了一个比较坑的办法:

if (typeof module !== 'undefined' && module.exports) {
    // Do something only in Node.JS
} else {
    // Do something else in the browser
}

我都判断, 判断exports和require.

if ( exports != undefined) { //这个判断很正常.
    exports = getpath;
};
if (require != undefined) { 
    //神奇的事情发生了, 这里会报错: Uncaught ReferenceError: require is not defined
    const {
        mpoint,
        pathplan
    } = require('./model_pointpath');
    const {
        littletop,
        findtop
    } = require('./tools_sort');
}

原因是我另外的地方写错了.

if (typeof exports != undefined)  {// 这里要用引号 "undefined", 因为typeof返回的是字符串.
	exports = {
		littletop,
		findtop
	}
}

实践证明, typeof是必须的, 没有typeof就会报错.

if (typeof module !== 'undefined' && module.exports) {}//这个是对的
if ( exports != undefined)  {//这个就会报错.

下面这么写都是可以的

typeof require !== 'undefined'; //false
typeof module !== 'undefined'; //false

最终的类似umd的写法:

if (typeof module !== 'undefined' && module.exports) {
	exports = getpath;
	const {
		mpoint,
		pathplan
	} = require('./model_pointpath');
	const {
		littletop,
		findtop
	} = require('./tools_sort');
}

if (typeof module !== 'undefined' && module.exports) {
	exports = {
		littletop,
		findtop
	}
}

参考内容:

1. 感谢杭锋, 没有杭锋其实这些参考资料都不生效.

2. 这里对比了common, AMD, umd, http://web.jobbole.com/82238/

   1. https://caolan.org/posts/writing_for_node_and_the_browser.html
   2. https://stackoverflow.com/questions/3225251/how-can-i-share-code-between-node-js-and-the-browser

3. 这里解释了为啥要用typeof, https://stackoverflow.com/questions/11380283/how-can-i-compare-a-non-existing-javascript-object-to-undefined-without-getting

   1. samuel liew的答案比较完整https://stackoverflow.com/questions/5113374/javascript-check-if-variable-exists-is-defined-initialized
   2. https://stackoverflow.com/questions/2559318/how-to-check-for-an-undefined-or-null-variable-in-javascript
   3. https://stackoverflow.com/questions/858181/how-to-check-a-not-defined-variable-in-javascript

4. https://webpack.docschina.org/guides/author-libraries/

5. https://github.com/reduxjs/react-redux/blob/master/package.json

6. 介绍了gulp, rollup, webpack, webpack-stream. https://my.oschina.net/tongjh/blog/837663

7. 介绍了webpack, https://juejin.im/post/5a23b130f265da432003101a

特大特大特大, 前面的代码有问题

if (typeof module !== 'undefined' && module.exports) {
    module.exports =  { //这里module.exports是关键, 如果就是exports, 那么下面的undefined就出现了.
        mpo,
        pat
    };
    var{
        mpoint,
        pathplan
    }  = require('./nodemomo');

}
console.log('module', typeof module);
console.log('require', typeof require);
console.log('exports', typeof exports);
console.log('mpoint', typeof mpoint);   //undefined
console.log('pathplan', typeof pathplan);  //undefined

原因是: 我蠢, export等于我单纯的修改了一个变量的值, 并没有形成引用修改. 等于我把这里的export重新定义了, 并不是修改module.export的值.