Laravel 混合和 AngularJs答案

【问题标题】：Laravel mix and AngularJsLaravel 混合和 AngularJs
【发布时间】：2017-07-17 23:10:12
【问题描述】：

我正在尝试使用运行 webpack 的 Laravel Mix 将 Angular 应用程序编译到一个文件中。我得到了错误：

Uncaught ReferenceError: app is not defined

我的webpack.mix.js:

const { mix } = require('laravel-mix');

mix.js('resources/assets/js/dependencies.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css');

我的bundle.js：

//load angular
require('angular');

//Load Angular's plugins
require('angular-ui-router');

//Init Angular app
require('./app/app');

//Load angular controllers
require('./app/Controller/aboutController');
....

//Load angular directive
require('./app/Directive/directive');

//Load angular services
require('./app/Services/AccountService');
....

我的app/app.js：

var app = angular.module('app', ['ui.router']);

app.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', function ($stateProvider, $urlRouterProvider, $locationProvider) {

$urlRouterProvider.otherwise('/home');

$stateProvider
    .state('home', {
        url: '/home',
        templateUrl: 'app/View/homeView.html',
        controller: 'homeController'
    })
    ...
}]);


app.run(['$state', '$rootScope', function ($state, $rootScope) {
    //APP RUN
}]);

当我调用app.controller() 时，我得到Uncaught ReferenceError: app is not defined，例如app/Controller/aboutController.js：

app.controller("aboutController", ['$scope', '$rootScope', '$http', function ($scope, $rootScope, $http) {....}

我错过了什么吗？如果我使用html 一个一个地加载所有文件，它可以正常工作。

【问题讨论】：

标签： javascript angularjs laravel webpack laravel-mix

【解决方案1】：

对于希望在下一个 Laravel 项目中以更自动化的方式执行此操作的任何人，我创建了一个 article 来解释如何。在 Angular 4-7 版本和 Laravel 5.4-5.8 版本上测试。希望对你有帮助！

【讨论】：

【解决方案2】：

如果您在单独的文件中定义应用的控制器，则不能直接使用 app，因为没有参考。您首先必须参考模块。

angular.module('app')
  .controller('aboutController'....

让我知道这是否适合你。

【讨论】：