angulaire.js - Webpack peut-il implémenter le chargement paresseux d'un routeur angulaire ?

Question

Webpack emballe un js principal puis le conditionne en deux js distincts. Cependant, lorsque la route change, le js de cette route n'est pas chargé
Un conseil ?

#core.router.js
import LoginRouter from 'bundle?lazy!../states/login/login.route'
import IndexRouter from 'bundle?lazy!../states/index/index.route'

function CoreRouter($routeProvider,$locationProvider) {

    $routeProvider
        .when('/',IndexRouter)
        .when('/login',LoginRouter)
        .otherwise({redirectTo: '/'});
}

CoreRouter.$inject = ['$routeProvider','$locationProvider'];

export default CoreRouter;

Ce qui suit est le module de chargement de base

#code.module.js
import $ from 'jquery'
import 'angular-animate'
import 'angular-route';
import 'angular-resource'
import 'angular-cookies'
import '../../lib/toaster/toaster.min'


import '../../service/service.module'
import '../..//components/components.module'
import '../..//filter/filter.module'

import '../../service/ApiConfig'
import '../../components/loading/http-loading';


import LoginModule from '../states/login/login.module'
import IndexModule from '../states/index/index.module'

//router核心模块最后加载
import CoreRouter from './core.router' //加载上面的核心路由模块

var CoreModule = angular.module('cm.bg',[
    'ngRoute',
    'ngCookies',
    'ngResource',
    'ngAnimate',
    'cm.filter',
    'cm.components',
    'cm.service',
    'toaster',

    LoginModule.name,IndexModule.name,
])
    .config(CoreRouter)
    .run(['$rootScope',
    function($rootScope){
    
    }]);


export default CoreModule

Answer 1

Utilisez ocLazyLoad pour implémenter le chargement différé