Wallaby.js с jQuery

Мы используем wallaby.js в проекте Angular 4 с машинописным текстом, а в некоторых частях используется jQuery. Wallaby.js выдает ошибку ReferenceError:

​​ReferenceError: $ is not defined​​

Любые идеи, как это исправить?

Некоторый пример кода:

import { Injectable } from '@angular/core';

declare var $: any;

@Injectable({
  providedIn: 'root'
})
export class FroalaService {

  constructor() { }
  public initFroala(): void {
    $.FroalaEditor.DefineIcon('insertnonbreakingspace', {NAME: 'arrows-h'});
    $.FroalaEditor.RegisterCommand('insertnonbreakingspace', {
      title: 'Non-Breaking Space',
      focus: true,
      undo: true,
      refreshAfterCallback: true,
      callback: function () {
        this.html.insert('<span style = "white-space: nowrap;"> </span>');
      }
    });
    $.FroalaEditor.RegisterShortcut(32, 'insertnonbreakingspace', null, 'Space', false, false);
  }
}

Включите любой код, определяющий $

alex 02.01.2019 15:00

Есть и другие части, но я не могу изменить код, мне нужно как-то настроить конфиг валлаби.

Mathias Müller 02.01.2019 15:06

1) Wallaby.js выдает ошибку или ваш пример кода при попытке использовать этот модуль как часть jQuery? 2) Как вы включаете jQuery в свой проект? Вы пытаетесь упаковать его или просто включить как тег скрипта?

Daniel Gimenez 02.01.2019 15:10

1) валлаби выдает ошибку, приложение и тест с кармой работают нормально. 2) jquery включен как пакет в package.json

Mathias Müller 02.01.2019 15:15

Это нормально, что он находится в package.json, но находится ли он в angular.json или загружен тегами скрипта в html? В любом случае, единственное, что я мог придумать, это то, что jquery загружается после валлаби и что валлаби немедленно вызывает jQuery. Можете ли вы подтвердить порядок их загрузки?

Daniel Gimenez 02.01.2019 15:49

jquery загружается в раздел сценариев в angular.json как первая запись «node_modules / jquery / dist / jquery.js». Порядка загрузки валлаби и jquery нигде нет.

Mathias Müller 02.01.2019 15:58

Извините, я не понял, что валлаби был тестовым фреймворком. Я просто смотрел несколько примеров и увидел, что ссылка на jquery добавлена ​​в файл конфигурации wallaby в разделе файлов. Может быть, добавить?

Daniel Gimenez 02.01.2019 16:25

Я нашел решение, но теперь у меня проблема с доступом к FroalaEditor с помощью $. Для VS Code все в порядке, но валлаби говорит: «TypeError: невозможно прочитать свойство DefineIcon из undefined»

Mathias Müller 02.01.2019 17:21
Как конвертировать HTML в PDF с помощью jsPDF
Как конвертировать HTML в PDF с помощью jsPDF
В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.
0
8
92
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Решением для базовой реализации jQuery является добавление jQuery к внешним компонентам в wallaby.js:

var webpackPostprocessor = wallabyWebpack({
    entryPatterns: [
      'src/wallabyTest.js',
      'src/**/*spec.js'
    ],

    module: {
      rules: [
        ...
      ]
    },

    resolve: {
      extensions: ['.js', '.ts'],
      modules: [
       ...
      ]
    },
    node: {
      ...
    },
    externals: { jQuery: "jQuery" }
  });

... и добавить jquery.js в файлы:

return {
    files: [
      {pattern: "node_modules/jquery/dist/jquery.js", instrument: false},
      {pattern: 'src/**/*.+(ts|css|less|scss|sass|styl|html|json|svg)', load: false},
      {pattern: 'src/**/*.d.ts', ignore: true},
      {pattern: 'src/**/*spec.ts', ignore: true}
    ],
    ...

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