16

LiveReload と Grunt を使用して保存したときに templateURL をリロードするにはどうすればよいですか?

angular.module('meshApp', [
  'ngSanitize',
  'ngRoute'
])
  .config(function ($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'views/main.html',
        controller: 'MainCtrl'
      })
      .otherwise({
        redirectTo: '/'
      });
  });

保存すると .tmp/views/main.html に処理される jade ファイル views/main.jade があります。現在、これは機能し、テンプレートを表示できますが、LiveReload を保存するとページをリロードできません。

それを機能させる方法はありますか?

また、役立つ場合に備えて、私の GruntFile へのリンクもここにあります: http://jsfiddle.net/daimz/Te5Xc/

4

3 に答える 3

1

編集 - - - - - - - - - - - - -

私が最初の回答を書いたとき、実際には十分に安定したものは何もなかったので、ライブリロードにいくつかの調整を加えました。その時以来、多くのことが変わりました。現時点 (2017 年初頭) では、browser-sync と webpack、HMR を使用しています。

編集 - - - - - - - - - - - - -

Angular/Ionic プロジェクトで動作するようになりました。

より多くの人がそのようなものを探していると思うので、github リポジトリを作成しました: https://github.com/stefanKuijers/live-templates

私のソリューションでは、Martin Kool が作成した live.js を使用しています (チェック )。コードを追加しただけです。live-templates.js にルーターへのパスを追加するだけです。live-templates.js はルーターのルートを取得し、それらを live.js ハートビートに追加します。

使用方法: - スクリプトを取得して保存します - 27 行目の routerURL 変数をルーターの URL に変更します - ライブ リロードが必要なページにスクリプトを含めます

私に知らせてください、またはそれがどのように機能したかを教えてください!

乾杯

于 2014-03-31T13:02:52.520 に答える
0

Gruntfile.js を簡略化すると、役立つ場合があります。

appPath:"", //your app path
watch: {
    options: {
        livereload: 35729,
        debounceDelay: 500
    },
    gruntfile: {
        files: ['Gruntfile.js']
    },
    css: {
        //if you use less or sass,you can compile and copy here
    },
    js: {
        files: ['<%= appPath %>/{scripts}/{,**/}*.js'],
        tasks: ['newer:all']
    },
    html: {
        files: ['<%= appPath %>/{views}/{,**/}*.html'],
        tasks: ['newer:all']
    },
    livereload: {
        options: {
            livereload: 35729,
            debounceDelay: 500
        },
        files: [
            '<%= appPath %>/{,**/}*.html',
            '<%= appPath %>/styles/{,**/}*.css',
            '<%= appPath %>/images/{,**/}*.{png,jpg,jpeg,gif,webp,svg}'
        ]
    }
}

そして実行します:

grunt.registerTask('server', [
    ...,
    'watch'
]);
于 2014-11-10T08:59:17.850 に答える