SystemJS: почему я получаю ошибку jquery 1.по умолчанию функция при импорте в jQuery

Я установил foundation через jspm install foundation, а затем импортировал foundation и jquery.

проблема в том, что если я импортирую jquery через import $ as 'jquery' Я получаю ошибку jquery_1.по умолчанию-это не функция. Если я импортирую jquery через import * as $ from jquery он работает так, как ожидалось

Я призываю $(document).foundation(); для инициализации компонентов javascript основы. Ниже мой основной.ТС

import 'foundation'
import $ from  'jquery';
import {Aurelia} from 'aurelia-framework';

export function configure(aurelia: Aurelia) {
  aurelia.use
    .standardConfiguration()
    .developmentLogging();    

  aurelia.start().then(a => a.setRoot())
      .then(a => {
        // Initialize framework
        $(document).foundation();
      });
}

остальная часть кода-это просто навигация по умолчанию на простую страницу, которая содержит панель навигации foundation с выпадающим списком

Примечание: мне также пришлось явно установить jquery, хотя jquery указан как dep.

Я сделал оригинальное переопределение для foundation 6, явно сделал что-то не так, но, похоже, он работал в то время. Однако с тех пор я узнал, что при установке bootstrap он поместил jquery в GitHub:components, и это, казалось, сделало его таким, что jquery не нужно было явно устанавливать. Так в то время все казалось штраф.

для воспроизведения просто используйте скелет aurelia и добавьте страницу с элементом управления foundation, добавив $(document).фонд (), как указано выше

9
jquery jspm systemjs typescript

2 ответов

Если вы используете TypeScript set module=system в вашем tsconfig:

{
  "compilerOptions": {
    "module": "system",
    "target": "es6",
    "sourceMap": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true
  },
  "exclude": [
    "node_modules",
    "jspm_packages"
  ]
}
1

Я считаю, что это проблема с typescript. Из того, что я могу сказать, он не уважает инструкцию импорта стиля es6 для устаревшего кода, т. е. кода, который не имеет экспорта. Если вы используете старый стиль var $ = require ('jquery'), он работает.

исправление для этого-использовать флаг --allowSyntheticDefaultImports в true.

первая ссылка в нижней части проблемы typescript описывает это исправление

эти дискуссии для более деталь

SystemJS и default импорт с export = предложение

импорт значений по умолчанию с синтаксисом es6 не работает

не удается найти правильный синтаксис экспорта переменных по умолчанию

5