Captain Awesome Broadcasts：BrowserSync Angular Template

リーグ！ 今日、私たちの世界は少し穏やかになります。



悪の勢力に対する新しい武器は、評議会による検証を待っています。 武器-BrowserSync Angular Template（bsAt）は、もちろんFlashの速度ではなく、私たち一人一人をスピードアップするように設計されていますが、敵よりも1秒も速くなることを拒否する人はいますか？

発明の歴史

Dr. Govno Codeの部下の大群との不平等な戦いに巻き込まれました。 ああ、それは退屈で、それぞれが自分のコーナーに隠れていて、私は彼らへのルートすらありませんでした。 外見を変えた私の打撃のそれぞれは、現実を破壊し、その後、戦場へのルート全体を再び行く必要がありました。 そして、アイデアを思いついたのです。世界を作り直すことなく、それらを変えてみませんか？ 私はそれらを時空の特定のポイントに関連付けることにしました。 皆を打ち負かし、世界を救い、そのまったくランダムで馴染みのないsmmで、瞑想の塔に引退しました。 それで数日が過ぎました...

技術資料

これで、最初のリリースの準備ができました！ 秘密の倉庫から取り出します。

npm i --save-dev browser-sync-angular-template
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

BsAtはBrowserSyncのプラグインです。 開始するには、プラグインするだけです：

 // ~Gulpfile.js var browserSync = require('browser-sync'); var browserSyncAngularTemplate = require('browser-sync-angular-template'); browserSync.use( browserSyncAngularTemplate({ templates: '/app/**/*.html', indexJs: 'index.module.js', moduleName: 'example' }) ); ... browserSync.init(...);
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

個人的には、私はgenerator-gulp-angularをtool generatorと一緒に使用することを好みます。それは多くの戦いに勝つ助けとなりました！



より正確な例は、 example / gulp / server.jsにあります。



もちろん、bsAtをバトルのコンテキストに合わせてカスタマイズできます。



テンプレートを使用すると、すべてが明確になると思います。これはテンプレートの座標のミニマッチパターンであり、テンプレートのみがbsAtを介して接続されます。



重要な点が1つあります。 テンプレートの内容は、必ず1つのタグでラップする必要があります。つまり、次のとおりです。



適切なオプション：

 <!-- app/some/some.html --> <div class="points"> <div class="form-group"> ... </div> <ul> <li ng-repeat="point in points.items">...</li> </ul> <div ng-if="!points.items.length"> <h4 class="text-center">...</h4> </div> </div>
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

誤った使用：

 <!-- app/some/some.html --> <div class="form-group"> ... </div> <ul> <li ng-repeat="point in points.items">...</li> </ul> <div ng-if="!points.items.length"> <h4 class="text-center">...</h4> </div>
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

indexJs-パターンを戦場のインデックスファイルにミニマッチします。 BsAtは必要なコードをこのファイルに挿入します。



moduleName-前のパラメーターと密接に関連しています。 同様に、プラグインコードを注入するために必要です。 Breniacの組み込みの切り捨てられたクローンは、bower.jsonまたはpackage.json自身から順番に決定します。



そして、それだけです。戦場の座標と世界の同期ポイントを設定することで、戦場の新しい状態を放送する一時的なトンネルのスペースが得られます。

発行

うーん、現在のソリューションにはあまり適していないポイントがいくつかあります。 決定を下す際にこれを考慮してください、おそらくあなたは何らかの方法で助けることができますか？

• 第一に、BrowserSyncのプラグインを作成することは今でもとても嬉しいことであり、そのようなドキュメントは見つかりませんでした。 既存のコードとの類推によって行われました。 あなたの一人が「まっすぐな目」と「グーグルで情報を検索する」という超能力を持っているなら、私は喜んでリンクします。
• 第二に、インデックスファイルにインジェクションするアーキテクチャがあまり好きではありませんでした。 ソースをより深く掘り下げて、angular.injectorを操作する方法を理解して、それとともに受信したモジュールがアプリケーションコンテキストで実行されるようにする必要があります。
• 第三に、今プラグインが流れています...不要な$ watch'ersをクリアするロジックを追加する必要があります。
• プロキシを使用した作業はまだテストされていないため、注入プロセス中に問題が発生する可能性があります。

これは私をかじっています。 おそらく、親愛なる評議会は、他の問題を見るでしょう。

親愛なる評議会とリーグ！

プロジェクトをさらに開発する唯一の方法は、あなたからの返答です。 秘密の倉庫の私のセクションにアクセスして、印象をインストールしてみてください！