веб-пакет ProvidePlugin не работает на ветер - PullRequest
0 голосов
/ 09 октября 2018

Я пытаюсь использовать breeze с веб-приложением TypeScript, которое использует веб-пакет (4.20.2).Эти записи находятся в моем файле npm package.json:

"dependencies": {
    "bootstrap": "3.3.6",
    "breeze-client": "1.7.1",
    "es6-promise-promise": "1.0.0",
    "jquery": "2.2.1"
  }

У меня есть конфигурация веб-пакета поставщика, которая имеет следующее:

  entry: {
            vendor: [
                'bootstrap',
                'bootstrap/dist/css/bootstrap.css',
                'breeze-client',
                'es6-promise-promise',
                'jquery'
            ]
        },
   plugins: [
            new webpack.ProvidePlugin({ 
                  $: 'jquery', 
                  jQuery: 'jquery', 
                  Promise: 'es6-promise-promise', 
                  Q: "q" 
            })
        ]

Я получаю

Ошибка: Q не определено.Вы скучаете по Q.js?См. https://github.com/kriskowal/q

Итак, я добавил полифилл в свой код, чтобы использовать ES6 Promises для Q, и сделаю это в моем коде запуска:

import { config } from 'breeze-client'
import { Q } from './lib/my-q-implementation';
config.setQ(Q)

Теперь я получаю это:

Невозможно найти jQuery

Я почти уверен, что boostrap ищет глобальный jQuery, поэтому я думаю, что проблема проста.

Почему Breeze не видит глобальный JQuery?Как мне это исправить?

1 Ответ

0 голосов
/ 12 октября 2018

Очень хакерский, но у меня все получилось с помощью import-loader.

module: {
 rules: [
    { 
     test: require.resolve('breeze-client/breeze.debug'), 
     use: 'imports-loader?this=>window,window.jQuery=jquery,window.ko=knockout,global=>{window: this}' 
    },
   ]
}

, что ставит это в начало скрипта breeze.

var window = (window || {});
window.jQuery = __webpack_require__(/*! jquery */ "./node_modules/jquery/dist/jquery.js");
var window = (window || {});
window.ko = __webpack_require__(/*! knockout */ "./node_modules/knockout/build/output/knockout-latest.debug.js");
var global = {window: this};

Мне не нравитсяэто потому, что он помещает jquery и ko в глобальную область видимости.

Я пробовал это, среди прочего, (для jquery), и это не сработало:

plugins: [
            new webpack.ProvidePlugin({
                $: "jquery",
                jQuery: "jquery",
                "window.jQuery": "jquery",
                "global.window.jQuery": "jquery"
            }),

И с этим на местеЯ все еще должен сделать это в другом скрипте, который ссылается на "$":

import * as $ from 'jquery';

Попробовал это в моем скрипте запуска также безуспешно:

import jQuery as $ from 'jquery';
window.jQuery = window.$ = jQuery;

Надеюсь, это кому-то поможет иНадеюсь, кто-то может предложить лучшее решение.

...