Хобрук: Ваш путь к мастерству в программировании

Ошибка при запросе внешней библиотеки с браузером (this = undefined)

Я пытаюсь потребовать библиотеку Chart.js с помощью Browserify (tbh это среда разработки с gulp, browserify и некоторыми другими вещами, которые я едва знаю, как они работают вместе):

'use strict';
var angular = require('angular');
require('angular-ui-router');
require('./templates');
require('./controllers/_index');
require('./services/_index');
require('./directives/_index');
window.gauge = require('./vendors/gauge');

//this is what i'm trying to require
window.chartjs = require('./vendors/chart');

angular.element(document).ready(function() {
  var requires = [
    'ui.router',
    'templates',
    'app.controllers',
    'app.services',
    'app.directives'
  ];
  window.app = angular.module('app', requires);
  angular.module('app').constant('AppSettings', require('./constants'));
  angular.module('app').config(require('./routes'));
  angular.module('app').config(require('./PostFix'));
  angular.module('app').run(require('./on_run'));
  angular.bootstrap(document, ['app']);
});

Tbh, он хорошо работал с window.gauge = require('./vendors/gauge');, но когда мне требуется vendors/chart.js, он выдает эту ошибку:

undefined                                                     // chart.js:4 
Uncaught TypeError: Cannot read property 'Chart' of undefined // chart.js:4 

А вот эти строки в файле chart.js:

(function(){

 "use strict";

  console.log(this); <------ outputs the "undefined"

  var root = this,
    previous = root.Chart; <----- fails, as "root" doesn't exist

Это странно, потому что, когда я добавляю chart.js с помощью <script></script>, этот console.log(this) выводит объект/область окна, но при выполнении из браузера он не определен, поэтому chart.js терпит неудачу.

Я новичок в browserify/node/gulp, но я пробовал разные вещи, такие как:

  • Browserify-shim -> та же ошибка
  • Запрашивать сценарий разными способами, например, пытаться потребовать его внутри объекта { }, пытаться сделать var whatever = new require('./vendors/chart'), но с треском провалиться, как обезглавленный цыпленок, пытающийся пойти в туалет.

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


Ответы:


1

Я уже решил это. Проблема заключалась в преобразовании браузера под названием Babelify. Я до сих пор не знаю, почему Babel это делает, но мне это все равно не нужно, поэтому я просто отключил его, и все. Просто размещаю это здесь на случай, если это случится с кем-то еще.

31.08.2015
  • Спасибо @FelixKling! Жаль, что я не бегал по нему раньше, я сошел с ума, меняя всякие вещи! 31.08.2015
  • Привет, @FelixKling, есть ли для этого обновленная страница? Тот, который вы связали, похоже, больше не существует. Спасибо! 02.04.2016
  • @AndyPerlitch: Нет, но вы можете посмотреть старую страницу здесь: github.com/babel/babel.github.io/blob/5.0.0/docs/ . 02.04.2016
  • Новые материалы

    Деревья классификации и регрессии
    Это мой второй пост об алгоритмах машинного обучения. Мой первый пост посвящен искусственным нейронным сетям, вы можете найти его ниже. Нейронные сети — базовое..

    HMTL - Многозадачное обучение для решения задач НЛП
    Достижение результатов SOTA путем передачи знаний между задачами Область обработки естественного языка включает в себя десятки задач, среди которых машинный перевод, распознавание именованных..

    Решения DBA Metrix
    DBA Metrix Solutions предоставляет удаленного администратора базы данных (DBA), который несет ответственность за внедрение, обслуживание, настройку, восстановление базы данных, а также другие..

    Начало работы с Блум
    Обзор и Codelab для генерации текста с помощью Bloom Оглавление Что такое Блум? Некоторые предостережения Настройка среды Скачивание предварительно обученного токенизатора и модели..

    Создание кнопочного меню с использованием HTML, CSS и JavaScript
    Вы будете создавать кнопочное меню, которое имеет состояние наведения, а также позволяет вам выбирать кнопку при нажатии на нее. Финальный проект можно увидеть в этом Codepen . Шаг 1..

    Внедрите OAuth в свои веб-приложения для повышения безопасности
    OAuth — это широко распространенный стандарт авторизации, который позволяет приложениям получать доступ к ресурсам от имени пользователя, не раскрывая его пароль. Это позволяет пользователям..

    Классы в JavaScript
    class является образцом java Script Object. Конструкция «class» позволяет определять классы на основе прототипов с чистым, красивым синтаксисом. // define class Human class Human {..