Heroku выдает ReferenceError и не распознает «$» в приложении узла

Я пытаюсь развернуть простое приложение на Heroku. Он отлично работает локально. Когда я пытаюсь обслужить его на Heroku, я получаю следующую ошибку:

ReferenceError: $ is not defined

Почему мне говорят, что проблема с $, хотя она отлично работает, когда я запускаю ее локально? Я получаю эту ошибку, когда запускаю локальную сеть heroku. Когда я пытаюсь развернуть приложение на героку, журналы сообщают мне, что оно не работает при попытке запуска npm. Хотя это проблема, я полагаю, что это не сработает, если я не запущу его локально с локальной сетью heroku. Код выглядит следующим образом:

источник/js/app.js

App = {
  ...
};

$(function() { // THIS IS THE FAILING LINE.
  $(window).load(function() {
    // App.listen(process.env.PORT || 8000);
    App.init();
  });
});

источник/index.html

<!DOCTYPE html>
<html lang = "en">
  <head>
    <meta charset = "utf-8">
    <meta http-equiv = "X-UA-Compatible" content = "IE=edge">
    <meta name = "viewport" content = "width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <link rel = "shortcut icon" type = "image/png" href = "static/favicon.ico"/>
    <!-- Bootstrap -->
    <link href = "css/bootstrap.min.css" rel = "stylesheet">
    <link href = "css/box.css" rel = "stylesheet", type = "text/css">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src = "https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
      <script src = "https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    </head>
    <body>
      <div class = "container" style = "width: 850px;">
           ...
      </div>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src = "js/bootstrap.min.js"></script>
    <script src = "jquery.min.js"></script>
    <script src = "js/app.js"></script>
    <!-- <script -->
  </body>
</html>

пакет.json

{
  "name": "theName",
  "version": "1.0.0",
  "description": "",
  "main": "truffle.js",
  "directories": {},
  "scripts": {
    "dev": "lite-server"
  },
  "author": "Me",
  "license": "MIT",
  "devDependencies": {
    "lite-server": "^2.3.0"
  }
}

Procfile

web:node src/js/app.js

В узле у вас нет окна. Если вы используете JavaScript для взаимодействия с браузером, вы должны обслуживать только скрипты, а не запускать их в узле.

Luis Cabrera Benito 06.03.2019 01:47

Как бы я тогда обслужил это в Heroku?

python_crypto_questions 06.03.2019 01:48

Это пахнет чем-то подозрительным с турболинками. Попробуйте поместить < "data-turbolinks-track" => false > в заголовок макета вашего приложения. Если ничего нет, попробуйте просто удалить ошибочную строку и связанную с ней }); и посмотреть, что происходит.

ShatteredDev 06.03.2019 02:57

К сожалению, это, похоже, мало что дало.

python_crypto_questions 06.03.2019 03:21
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
4
79
0

Другие вопросы по теме