ntegração do @Webpack FOSJsRoutingBundle com o Symfony Flex e o Angular

Eu não posso pegar FOSJsRoutingBundle trabalhar comSymfony Flex, Webpack e AngularJS.

Eu uso esse pacote no Symfony 3 com o AngularJS há muito tempo e nunca houve um problema, mas com a introdução do webpack no Symfony Flex, a configuração ficou mais complexa. Infelizmente, a documentação para o FOSJsRoutingBundle versão 2.2 não está clara.

Você pode encontrar a documentação atual para este pacoteAqu.

Estou usando o FOSJsRoutingBundle para que minhas solicitações HTTP angulares possam usar as rotas geradas em vez de URLs absoluta

O problem

Configurei este pacote conforme documentado através do compositor. As rotas são despejadas em um arquivo json localizado emcode/assets/fos_js_routes.json. As rotas geradas neste arquivo são válidas e o que eu espero ver.

Como estou usando Angular, quero fazer a declaração inicial exigida do Roteamento em um arquivo separado, para que todos os meus controladores Angular possam usar oRouting. sem ter que fazer nenhum trabalho adicional nesses arquivo

FOS setup file /code/assets/js/fos_js_router.js (Seguindo a documentação)

const routes = require('../../assets/fos_js_routes.json');
import Routing from '../../vendor/friendsofsymfony/jsrouting-bundle/Resources/public/js/router.min.js';

Routing.setRoutingData(routes);

Amostra arquivo angular /code/assets/js/apps/default/controller/test.js

(function () {

    'use strict';

    angular.module('test')
    .controller(
        'TestCtrl',
        ['$scope', '$http',
            function ($scope, $http) {

                let url = Routing.generate('test_route_name');
             }
         ])
});

Webpack Config

var Encore = require('@symfony/webpack-encore');

Encore
    .setOutputPath('public/build/')
    .setPublicPath('/build')
    .addEntry('app', './assets/js/app.js')
    .addEntry('app_fos_router', [
        './assets/js/fos_js_router.js'
    ])
    .addEntry('app_angular', [
        './assets/js/apps/default/app.js', // angular app setup
        './assets/js/apps/default/routes.js', // angular routes setup
        './assets/js/apps/default/controller/test.js' // angular where Routing is needed
    ])
    .enableSingleRuntimeChunk()
    .cleanupOutputBeforeBuild()
    .enableBuildNotifications()
    .enableSourceMaps(!Encore.isProduction())
    .enableVersioning(Encore.isProduction())
;

module.exports = Encore.getWebpackConfig();

Modelo de galho de front-end

{% extends 'base.html.twig' %}

{% block title %}Test{% endblock %}

{% block javascripts %}
    {{ encore_entry_script_tags('app') }}
    {{ encore_entry_script_tags('app_fos_router') }}
    {{ encore_entry_script_tags('app_angular') }}
{% endblock %}

{% block body %}
    <div ng-app="test" ui-view="content"></div>
{% endblock %}

O err

Da configuração acima, recebotest.js: ReferenceError: Routing is not defined at nos meus arquivos AngularJS.

O que preciso fazer de maneira diferente para poder usarlet url = Routing.generate('test_route_name'); nos meus arquivos AngularJS?