8

単一ページの Angular アプリを提供する Django アプリを構築しています。

Django サーブの Angular の index.html には、次の usemin スクリプト ブロックがあります。

<!-- build:js scripts/scripts.js -->
<script src="{% static "scripts/app.js" %}"></script>
<script src="{% static "scripts/controllers/main.js" %}"></script>
<script src="{% static "scripts/controllers/stats.js" %}"></script>
<script src="{% static "scripts/directives/highchart.js" %}"></script>
<!-- endbuild -->

Usemin はファイルシステムで "{% static "scripts/app.js" %}" を見つけようとしますが、実際に見つけようとしているのは "scripts/app.js" であるため、もちろん失敗します。

誰もこれに対する回避策を見たことがありますか?

4

2 に答える 2

3

（解決策をグーグルで検索すると、この質問を見つけ続けるので、ここで見つけた解決策を共有して、私のような他の人が見つけられるようにします。）

タグを使用して html テンプレートで静的ファイルをラップできるgrunt-bridgeと呼ばれる grunt プラグインを発見しました。staticドキュメントは素晴らしいものではありませんが、プロジェクトで機能させる方法を考え出しました。

次のようなスクリプトがある場合:

<!-- build:js({.tmp,app}) /scripts/scripts.js -->
    <script src="scripts/app.js"></script>
    <script src="scripts/util/util.js"></script>
    ...

そして、最終的な出力は次のようなものを出力します:

<script src="{% static 'adjangoappname/scripts/94223d51.scripts.js' %}"></script>

gruntbridge をインストールnpm install grunt-bridge --save-devし、Gruntfile.js の grunt.initConfig に次のような構成を追加します。

bridge: {
  distBaseHtml: {
      options: {
          pattern: '{% static \'adjangoappname{path}\' %}',
          html: '<%= yeoman.minifiedDir %>/index.html', dest: '<%= yeoman.templateDir %>/index.html'
      }
  },
  distIndexHtml: {
      options: {
          pattern: '{% static \'adjangoappname{path}\' %}',
          html: '<%= yeoman.minifiedDir %>/index.html', dest: '<%= yeoman.templateDir %>/index.html'
      }
  },
  // ... etc for each html file you want to modify
},

は最終的に縮小されたhtml<%= yeoman.minifiedDir %>ファイルの出力ディレクトリで、<%= yeoman.minifiedDir %>は宛先テンプレート ディレクトリです。django アプリの名前または任意のディレクトリ プレフィックスに置き換えadjangoappnameます。

次に、次のように registerTask リストの最後に grunt-bridge を追加します。

grunt.registerTask('build', [
    //...
    'htmlmin',
    'bridge'
]);

(設定をよりコンパクトにすることは可能だと思いますが、これは私が発見した最初の方法です)

于 2014-06-20T06:57:12.357 に答える