Uncaught ReferenceError: требование не определено с использованием AngularJS, Rails 4 и Browserify

Question

Uncaught ReferenceError: требование не определено с использованием AngularJS, Rails 4 и Browserify

0

Я использую AngularJS и Rails и следую за http://start.jcolemorrison.com/setting-up-an-angularjs-and-rails-4-1-project/ и несколькими другими учебниками, чтобы получить очень простой "Hello World", пример вверх и работает на моем рабочем столе. Проблема в том, что когда я развертываю его на сервере, ни один из моих кодов, основанный на работе с Angular, больше не работает. Вместо этого, я получаю сообщение об ошибке " Uncaught ReferenceError: require is not defined ошибка в моей консоли.

Я понял, что часть моей проблемы заключается в том, что браузер не знает, что делать с вызовами "требовать", что имеет смысл, поэтому я установил Browserify с помощью браузеров-рельсов. Тем не менее, он по-прежнему не работает на сервере, как я ожидал, и получаю ту же ошибку.

Ссылка на сайт: Link

Здесь мой application.html.erb (упрощенный):

<!DOCTYPE html>
<html>
<head>
  <base href="/" />
  <title>ShibaInu</title>
  <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => false %>
  <%= javascript_include_tag 'application', 'data-turbolinks-track' => false %>
  <%= csrf_meta_tags %>
</head>
<body ng-app="shibaInu">
  <div class="container">1 + 2 = {{ 1 + 2 }}</div>

  <div class="container">
    <%= yield %>
  </div>

</body>
</html>

index.html.erb:

<div ng-view=""></div>

home.html.erb (отображается внутри контейнера):

<h1>The Home View!</h1>
<ul>
  <li ng-repeat="thing in things">
    {{thing}}
  </li>
</ul>

home.js:

angular.module('shibaInu')
    .controller('HomeCtrl', function ($scope) {
        $scope.things = ['Angular', 'Rails 4.1', 'Working', 'Together!!'];
    });

app.js:

angular
    .module('shibaInu', [
        'ngRoute',
        'templates'
    ]).config(function ($routeProvider, $locationProvider) {
        $routeProvider
            .when('/', {
                templateUrl: 'home.html',
                controller: 'HomeCtrl'
             });
        $locationProvider.html5Mode(true);
    });

application.js

//= require jquery
//= require jquery_ujs
//= require angular
//= require angular-route
//= require angular-resource
//= require angular-rails-templates
//= require bootstrap-sprockets
//= require ng-app/app.js
//= require_tree ../templates
//= require_tree .

Jimmy M 06 окт. 2015, в 02:44

Источник

0

Можете ли вы опубликовать свой файл манифеста application.js ?
Zoran 05 окт. 2015, в 23:51
0

@Zoran Спасибо за быстрый ответ! Я добавил это к посту.
Jimmy M 05 окт. 2015, в 23:57

Теги:

angularjs

ruby-on-rails

ruby-on-rails-4

browserify

browserify-rails

1 ответ

Ещё вопросы

Можете ли вы опубликовать свой файл манифеста application.js ?
@Zoran Спасибо за быстрый ответ! Я добавил это к посту.

Jimmy M · Accepted Answer · 2015-10-05T23-31-00.000Z

Я делал несколько ошибок, но я попытаюсь подвести итог:

Я минимизирую JS на моем развертывании сервера, как хороший мальчик, но я не писал JS с минимальной оценкой. См. Ниже мой фиксированный JS.
Это не было указано в моем первоначальном посте, но я не использовал angularjs-rails с angularjs-rails как я думал. Я добавил это в свой проект.
Что касается 2 выше, в моем первоначальном посте я использовал беседку для установки углов, как рекомендует документация. Для моего решения я взял это, потому что это просто делало вещи бесполезными для моих целей.

Новый home.js:

angular.module('shibaInu')
    .controller('HomeCtrl', ['$scope', function ($scope) {
        $scope.things = ['Angular', 'Rails 4.1', 'Working', 'Together!!'];
    }]);

Новые app.js:

angular
    .module('shibaInu', [
        'ngRoute',
        'templates'
    ]).config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
        $routeProvider
            .when('/', {
                templateUrl: 'home.html',
                controller: 'HomeCtrl'
             });
        $locationProvider.html5Mode(true);
    }]);