![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
「.NET 開発基盤部会 Wiki」は、「Open棟梁Project」,「OSSコンソーシアム .NET開発基盤部会」によって運営されています。
最近、のJavaScriptモジュール以下のような文字列が入っていたりしてフリーズしますね。
var myModule = require('...');
何気に、Reactも書いてますが、JavaScript書いている自覚がなかったりします。
最近はAMD(Asynchronous Module Definition)ではなく
CommonJS上でのモジュール化仕様
ES2015の仕様が策定されたことにより、
標準でモジュール化が可能となった。
ブラウザからモジュール化されていないJSを使用する。
<script src="XXXX.js"></script>
var util = require('ossc-test-library1');
...
util.sayAdd(1, 2); // 3
util.saySubtract(2, 1); //1
util.say // error. util.say is not a functionimport util from 'ossc-test-library1'; ... util.sayAdd(1, 2); // 3 util.saySubtract(2, 1); //1 util.say // error. util.say is not a function
がある。
CommonJS派からもRequireJSに対抗してBrowserifyが生まれる。
RequireJSとBrowserifyのイイとこ取りをした後発のモジュールシステムがwebpack。
CommonJSあるいはES2015 Moduleで定義。
exports.sayAdd = function(a, b) {
say(a + b);
}
exports.saySubtract = function(a, b) {
say(a - b);
}
say = function(word) {
console.log(word);
}var util = require('./util');
util.sayAdd(1, 2); // 3
util.saySubtract(2, 1); //1
util.say // error. util.say is not a function// コンストラクタ
var Movie = function(title) {
this.title = title;
}
Movie.prototype.sayTitle = function() {
say(this.title);
}
say = function(word) {
console.log(word);
}
module.exports = Movie;
・例２module.exports = function(title) {
this.title = title;
this.sayTitle = function() {
say(this.title);
}
}
function say(word) {
console.log(word);
}var Movie = require('./movie');
var movieA = new Movie('Star Wars');
movieA.sayTitle(); //Star Wars
var movieB = new Movie('Mad Max');
movieB.sayTitle(); // Mad Max
movieB.say(); // error. movieB.say is not a function従って、ここでは、named exports の例のみ紹介。
export function cube(x) {
return x * x * x;
}
const foo = Math.PI + Math.SQRT2;
export { foo };import { cube, foo } from 'my-module';
console.log(cube(3)); // 27
console.log(foo); // 4.555806215962888
