Nodejsページの「擬似動態化」に関する初歩的な試み
11072 ワード
ExpressのJadeテンプレートを放棄してから、静的リソースサーバを加えて、満楼の小さい駅はすでに全部静的になりました.なぜJade(Expressの他のテンプレートを含む)を捨てますか?実は私もまだ自分でテンプレートを作る能力がありません.放棄したらどうやって選びますか?すみません、Jadeさん、この道を最後まで歩きます.
私は素人の小さな先端で、アマチュアの初心者であるNodejsという道を断続的に勉強しています.大志がないのは、私のこの風采の上がらないブログをたぐるだけです.フロントエンドの構造を話し始めて、各種のツール(何Graunt、Glp、Webpack、FISなど)を結び付けて、一連の先端の工事化の体系を製造して、ははは、あれは間違いなく私で、間違いなく私が発言権がないのです;でも、これは確かに魅力的で憧れの的です.頑張ってください.
最初に、フロントエンドはSeajsを使って、自分で作ったのとネット上のcopyのを合わせて、自分で考えたモジュールとコンポーネントを基础モジュールとして、全駅はmain.jsで代理して、全駅の入り口として、彼の内の部分から各ページのメインモジュールを送りました.各メインモジュール内のrequire基础モジュールです.その後、徐々に先端の資源を最適化し、基礎モジュールの区分がちょっと細すぎるかもしれません.ご存知のように、httpの要求回数は少し基準を超えています.怒っても怒りません.spmはちょっと穴があります.それから、私は考えを変えます.Gulpとbrowserifyを使って、JavascriptをNodejsの端に導入します.まず、そのモジュールをNodejsモジュール化規格に適合するモジュールに改造しましたが、jQueryのような大きなベースクラスと公共モジュールを改造していません.そして、Gulp browserifyを書いて各ページのメインモジュールをキーでコンパイルします.今回は、モジュールの細分化によるhttp要求回数が多すぎることを心配しないでください.最後に、Nodejsプログラムを書くようにrequireモジュールに行って、あなたの先端Javascriptを書きます.また、browserify、NPMモジュール、内部コアモジュール、あなたが作ったモジュールの間で互いに共存し、相互に呼び出すことができます.もちろん、たとえこのようにしましたとしても、それは全駅の入り口のmain.jsとしてまだ使えます.(参照:先端構造の調整に関する実践)
お母さん、逃げたようです.「偽静的」はほとんどの人が聞いたり、実践したりしたことがあるでしょう.私はネットのURLRewriteだけを知っています.短い接続などがあります.確かに複雑で、維持と管理が難しいです.ほほほ、初めて先端に入ります.私はNodejsに対してだけの愛情があります.私は「擬静」ではなく、静的にしたいです.Expressはこのように使いやすいRouterがあります.私達もURLRewriteを必要としません.はい、私は本当に静的で、同時に「擬似動態」をやります.それでは、問題はすぐ来ました.全駅はあなたの静的なページです.また内蔵のテンプレートを捨てました.この静的なページはどうやって統一的に管理しますか?また、静的なページのキャッシュも深刻です.いつも訪問者に強いブラシをかけるように注意してはいけません.
持っていないのに、捨てるなんて.Jadeとすれ違った以上、美しい出会いになるでしょう.遠くに志し、今を生きています.私は新しく選んで、大衆のやり方によって、最も基本的なHeaderとBottomを抽出します.見慣れた感じを保つために、ページ上では
次に下記のコードを実行すると生成できます.一番上の変数を事前に設定すればいいです.
苦しめて行きましたが、今はExpressプロジェクトの骨格の中のviewsディレクトリはすでに私に空きました.彼のページといくつかの粗製乱造のtemplsを交換して、私のこの時々の騒動を許して、時には不安定な心、静かなのが美しい男の人をしたいのは難しいです.考えてみれば、話はまだ詳しくないです.いつか来た時の道を続けてください.
私は素人の小さな先端で、アマチュアの初心者であるNodejsという道を断続的に勉強しています.大志がないのは、私のこの風采の上がらないブログをたぐるだけです.フロントエンドの構造を話し始めて、各種のツール(何Graunt、Glp、Webpack、FISなど)を結び付けて、一連の先端の工事化の体系を製造して、ははは、あれは間違いなく私で、間違いなく私が発言権がないのです;でも、これは確かに魅力的で憧れの的です.頑張ってください.
最初に、フロントエンドはSeajsを使って、自分で作ったのとネット上のcopyのを合わせて、自分で考えたモジュールとコンポーネントを基础モジュールとして、全駅はmain.jsで代理して、全駅の入り口として、彼の内の部分から各ページのメインモジュールを送りました.各メインモジュール内のrequire基础モジュールです.その後、徐々に先端の資源を最適化し、基礎モジュールの区分がちょっと細すぎるかもしれません.ご存知のように、httpの要求回数は少し基準を超えています.怒っても怒りません.spmはちょっと穴があります.それから、私は考えを変えます.Gulpとbrowserifyを使って、JavascriptをNodejsの端に導入します.まず、そのモジュールをNodejsモジュール化規格に適合するモジュールに改造しましたが、jQueryのような大きなベースクラスと公共モジュールを改造していません.そして、Gulp browserifyを書いて各ページのメインモジュールをキーでコンパイルします.今回は、モジュールの細分化によるhttp要求回数が多すぎることを心配しないでください.最後に、Nodejsプログラムを書くようにrequireモジュールに行って、あなたの先端Javascriptを書きます.また、browserify、NPMモジュール、内部コアモジュール、あなたが作ったモジュールの間で互いに共存し、相互に呼び出すことができます.もちろん、たとえこのようにしましたとしても、それは全駅の入り口のmain.jsとしてまだ使えます.(参照:先端構造の調整に関する実践)
お母さん、逃げたようです.「偽静的」はほとんどの人が聞いたり、実践したりしたことがあるでしょう.私はネットのURLRewriteだけを知っています.短い接続などがあります.確かに複雑で、維持と管理が難しいです.ほほほ、初めて先端に入ります.私はNodejsに対してだけの愛情があります.私は「擬静」ではなく、静的にしたいです.Expressはこのように使いやすいRouterがあります.私達もURLRewriteを必要としません.はい、私は本当に静的で、同時に「擬似動態」をやります.それでは、問題はすぐ来ました.全駅はあなたの静的なページです.また内蔵のテンプレートを捨てました.この静的なページはどうやって統一的に管理しますか?また、静的なページのキャッシュも深刻です.いつも訪問者に強いブラシをかけるように注意してはいけません.
持っていないのに、捨てるなんて.Jadeとすれ違った以上、美しい出会いになるでしょう.遠くに志し、今を生きています.私は新しく選んで、大衆のやり方によって、最も基本的なHeaderとBottomを抽出します.見慣れた感じを保つために、ページ上では
1 module.exports=function(host) {
2 return [
3 '<header>',
4 ......
5 '</header>'
6 ].join('');
7 }; 1 var online=false;
2 var host="localhost:4000";
3 var header=require('../templs/header.js')(host);
4 var bottom=require('../templs/bottom.js')(host);
5 function createStaticPages(name,html,fn) {
6 var path='./path/'+name+'.html';
7 if (online) {
8 path='./path_online/'+name+'.html';
9 };
10 var ws=fs.createWriteStream(path);
11 ws.write(html,function(err) {
12 console.log('writePage:'+path);
13 fn&&fn();
14 });
15 ws.on('drain',function() {
16 ws.end();
17 });
18 };
19 function renderStaticPage(name,online) {
20 var rs=fs.createReadStream('./pages/'+name+'.html');
21 var body=[],size=0;
22 rs.on('data',function(data) {
23 body.push(data);
24 size+=data.length;
25 });
26 rs.on('error',function(err) {
27 console.log(err);
28 });
29 rs.on('end',function() {
30 var buffer=Buffer.concat(body,size);
31 var html=buffer.toString();
32 var $=cheerio.load(html);
33 if ($('header').html()=='') {
34 $('header').replaceWith(header);
35 };
36 if ($('bottom').html()=='') {
37 $('bottom').replaceWith(bottom);
38 };
39 var _html='<!DOCTYPE html><html>'+$('html').html()+'</html>';
40 if (online) {
41 var _html='<!DOCTYPE html><html>'+$('html').html().replace(/(localhost:4000)/ig,'cdn.famanoder.com')+'</html>';
42 };
43 createStaticPages(name,reconvert(_html));
44 });
45 };次に下記のコードを実行すると生成できます.一番上の変数を事前に設定すればいいです.
1 (function(files) {
2 for(var i in files){
3 (function(name) {
4 renderStaticPage(name,online);
5 })(files[i]);
6 }
7 })([
8 'h5lab',
9 'minips',
10 'sprite'
11 ]);苦しめて行きましたが、今はExpressプロジェクトの骨格の中のviewsディレクトリはすでに私に空きました.彼のページといくつかの粗製乱造のtemplsを交換して、私のこの時々の騒動を許して、時には不安定な心、静かなのが美しい男の人をしたいのは難しいです.考えてみれば、話はまだ詳しくないです.いつか来た時の道を続けてください.