振り返る時に歩いたモジュール化の道
7049 ワード
ころころと先端の道にぶつかって一年間走りました.経験がなくて、にぎやかさを目撃することができなくて、たまに巨人の肩の上に立って未来を眺めることしかできません;先端の種類倉庫、フレームの百花が一斉に放して、Nodejsのは火が熱くて、各道の侠客の苦心が研究して、きっと先端の仕事を1つの新しい高度に推し進めました;フロントエンドの生態圏の中には絶えず広がりと豊富さが含まれています.最後にアリ人の大先端に対する研讨を見ました.この小さな先端に強い心針を打たれました.この大きな先端を覚えるために、私はわざわざ私の小さい駅の404ページをこのスローガンにしました.みんなはうっかり中に入ってしまいました.笑わないでください.先端の独特な風景をよく見てください.
1、あの時、空が青すぎて、モジュール化とは何かが分かりませんでした.
最初にJSを勉強した時、他の人のアニメの特効をまねて、Move.jsと言いました.Move.start(obj、{atr:val}そしてこのjsを持って他の人のbannerを模倣して、その後、検証コード、滝流、改ページ、エディターなどを模擬しました.全部単独でファイルを作るので、必要な時に引用します.今から思えば、これはモジュール化の雛形かもしれない.今思えば、あの時は無邪気にいじっていましたが、実は元のJSはとても面白いです.今思えば、jQuery以来、約束の元はJavascriptですか?jQueryに甘やかされそうですね.しかし、jQueryのプラグインもモジュール化されているはずです.見てください.モジュール化は実はあなたのコードの中にあります.あなたはただ一つの思い通りの方法で実践しています.
2、ついに、モジュール化の規範化
Communjs規格に基づいて、二つの大きな分岐が生まれました.(1)、AMD規範とその代表:Requirejs;(2)、CMD規範とその代表:Seajs;両方とも良い先端モジュール化の解決策です.この二つについては、それぞれ何日間か夜を語り合うことができます.多くは言いません.上に述べたように、あなたが使っているように、大きなプロジェクトとチームの協力の場合、多くの場合、思いがけない問題は時々あなたに人生をやり直すように教えてくれます.例えば、命名衝突、ファイル依存、一山のjsファイルは管理と維持が困難であり、同時にいくつかの先端の性能問題が影響します.requirejsとseajsはあなたにとても良い解決のこれらの悩みを助けることができて、あなたがそのモジュール化の規範に従って開発する時、あなたは依然として心のままにすることができて、依然としてあなたの方法によってあか抜けているのがJavaScriptを書くことができます.
例えばseajsでモジュールを定義する必要があります.
そうだ、今はまだjQueryとプラグインに離れられません.まずはjqueryをCMD規格に合うように改造しましょう.
あら、やっと先端のモジュール化の道に行きました.(先端構造調整についての実践)このブログでseajsに基づいて言及したことがあります.全駅はsrcの2つのファイルだけです.seajsとmanjs;大体の意味は各ページのメインモジュールとして、全駅はメインモジュールとして、manjsから全駅の各大きいモジュールを代行して、ページがむやみにjsをプラスしないことを実現して、そしてあなたによって統一的に管理して、感じはさわやかです!
しかしその後、nodejsに基づいて、私は移り気になりました.nodejsのやり方がもっと好きです.そこで、先端開発環境にnodejsを導入しました.Nodejsがフロントエンドを組織して環境を開発して、同様にモジュールを区分して、しかしNodejsのモジュール化の規範によってで、このようにjavascriptをNodejsの端に導入して、最後にGulpから1鍵盤で包装して、前線のフォルダに圧縮します.参照:(BrowserifyはあなたのJavascriptを前後端に遊ばせます)
3、Nodejsの懐に入れて、モジュール化を徹底的に行う.
Nodejsの世界にはすべてモジュールがあります.
NodejsではCommunjsで定義されているモジュール機構を使用しています.Javascriptファイルごとにモジュールです.モジュールとファイルの間には1つの対応関係があります.モジュールは、exportを通じて、モジュールをロードし、モジュールが提供するインターフェースを使用する属性および方法を含むインターフェースを対外的に提供する.BrowserifyはNodejsとブラウザの間の橋として、JavascriptをNodejs端に拡張し、NPMモジュールを書き換えて、ブラウザも多くのNPMモジュールを使用できます.また、Browserifyもモジュール間の依存をよく解決しました.アプリケーションモジュールと依存モジュールをJavascriptファイルにパッケージ化できます.
Nodejsプログラムを書くようにJavaScriptを書いてもいいです.require NPMモジュールのようにrequireあなたのJavaScriptモジュールです.
global.$=require('jquery')
ページの中のjqueryコードブロックが現れることを防止するために、私はやはりnodejsの中でrequireではなく、前のやり方によって、直接srcが入ってきます.他のページはキャッシュを取ってもいいし、glp browserifyの後でjsファイルが大きすぎることを防止できます.
今はこう書きました.
事はこのような事で、情況はこのような情況で、どのみち私は更にこのようなやり方が好きで、最初の書き方に帰って、もちろんパッケージのがとても完備していてそれでは最も良くて、JavaScriptとNodejsを連絡していっしょにとてもクールですか?
振り返ってみると、モジュール化の道は三つの段階を通りました.結局はNodejsの懐に入れました.今はrquirejsを使わなくてもいいです.seajsを使わなくてもいいです.モジュール化はまだ進行中です.JavaScriptとNodejsの途中のもっとかっこいい風景を期待しています.阿弥陀仏ですか?おやすみなさい.
1、あの時、空が青すぎて、モジュール化とは何かが分かりませんでした.
最初にJSを勉強した時、他の人のアニメの特効をまねて、Move.jsと言いました.Move.start(obj、{atr:val}そしてこのjsを持って他の人のbannerを模倣して、その後、検証コード、滝流、改ページ、エディターなどを模擬しました.全部単独でファイルを作るので、必要な時に引用します.今から思えば、これはモジュール化の雛形かもしれない.今思えば、あの時は無邪気にいじっていましたが、実は元のJSはとても面白いです.今思えば、jQuery以来、約束の元はJavascriptですか?jQueryに甘やかされそうですね.しかし、jQueryのプラグインもモジュール化されているはずです.見てください.モジュール化は実はあなたのコードの中にあります.あなたはただ一つの思い通りの方法で実践しています.
2、ついに、モジュール化の規範化
Communjs規格に基づいて、二つの大きな分岐が生まれました.(1)、AMD規範とその代表:Requirejs;(2)、CMD規範とその代表:Seajs;両方とも良い先端モジュール化の解決策です.この二つについては、それぞれ何日間か夜を語り合うことができます.多くは言いません.上に述べたように、あなたが使っているように、大きなプロジェクトとチームの協力の場合、多くの場合、思いがけない問題は時々あなたに人生をやり直すように教えてくれます.例えば、命名衝突、ファイル依存、一山のjsファイルは管理と維持が困難であり、同時にいくつかの先端の性能問題が影響します.requirejsとseajsはあなたにとても良い解決のこれらの悩みを助けることができて、あなたがそのモジュール化の規範に従って開発する時、あなたは依然として心のままにすることができて、依然としてあなたの方法によってあか抜けているのがJavaScriptを書くことができます.
例えばseajsでモジュールを定義する必要があります.
1 define(function(require,module,exports){
2
3 var a=require('a');// （ ）
4
5 module.exports=...;
6
7 });そうだ、今はまだjQueryとプラグインに離れられません.まずはjqueryをCMD規格に合うように改造しましょう.
1 define(function(require,exports,module){
2
3 //jquery
4
5 module.exports=$.noConflict(true);
6
7 });あら、やっと先端のモジュール化の道に行きました.(先端構造調整についての実践)このブログでseajsに基づいて言及したことがあります.全駅はsrcの2つのファイルだけです.seajsとmanjs;大体の意味は各ページのメインモジュールとして、全駅はメインモジュールとして、manjsから全駅の各大きいモジュールを代行して、ページがむやみにjsをプラスしないことを実現して、そしてあなたによって統一的に管理して、感じはさわやかです!
しかしその後、nodejsに基づいて、私は移り気になりました.nodejsのやり方がもっと好きです.そこで、先端開発環境にnodejsを導入しました.Nodejsがフロントエンドを組織して環境を開発して、同様にモジュールを区分して、しかしNodejsのモジュール化の規範によってで、このようにjavascriptをNodejsの端に導入して、最後にGulpから1鍵盤で包装して、前線のフォルダに圧縮します.参照:(BrowserifyはあなたのJavascriptを前後端に遊ばせます)
3、Nodejsの懐に入れて、モジュール化を徹底的に行う.
Nodejsの世界にはすべてモジュールがあります.
NodejsではCommunjsで定義されているモジュール機構を使用しています.Javascriptファイルごとにモジュールです.モジュールとファイルの間には1つの対応関係があります.モジュールは、exportを通じて、モジュールをロードし、モジュールが提供するインターフェースを使用する属性および方法を含むインターフェースを対外的に提供する.BrowserifyはNodejsとブラウザの間の橋として、JavascriptをNodejs端に拡張し、NPMモジュールを書き換えて、ブラウザも多くのNPMモジュールを使用できます.また、Browserifyもモジュール間の依存をよく解決しました.アプリケーションモジュールと依存モジュールをJavascriptファイルにパッケージ化できます.
Nodejsプログラムを書くようにJavaScriptを書いてもいいです.require NPMモジュールのようにrequireあなたのJavaScriptモジュールです.
global.$=require('jquery')
ページの中のjqueryコードブロックが現れることを防止するために、私はやはりnodejsの中でrequireではなく、前のやり方によって、直接srcが入ってきます.他のページはキャッシュを取ってもいいし、glp browserifyの後でjsファイルが大きすぎることを防止できます.
今はこう書きました.
1 $(function(){
2
3 require('../modules/header');
4
5 require('../modules/bottom');
6
7 //.....
8
9 }); 1 var gulp=require('gulp');
2 var browserify = require("browserify");
3 var source = require("vinyl-source-stream");
4 var streamify=require('gulp-streamify');
5 var uglify=require('gulp-uglify');
6 var buffer=require('vinyl-buffer');
7
8 gulp.task('browserify',function() {
9 return browserify('./dist/javascripts/dev/page/about.js')
10 .bundle()
11 .pipe(source('about.js'))
12 .pipe(buffer())//.pipe(streamify(uglify())) //
13 .pipe(gulp.dest('./dist/javascripts'))
14 });事はこのような事で、情況はこのような情況で、どのみち私は更にこのようなやり方が好きで、最初の書き方に帰って、もちろんパッケージのがとても完備していてそれでは最も良くて、JavaScriptとNodejsを連絡していっしょにとてもクールですか?
振り返ってみると、モジュール化の道は三つの段階を通りました.結局はNodejsの懐に入れました.今はrquirejsを使わなくてもいいです.seajsを使わなくてもいいです.モジュール化はまだ進行中です.JavaScriptとNodejsの途中のもっとかっこいい風景を期待しています.阿弥陀仏ですか?おやすみなさい.