Webpack - как сделать скомпилированные функции доступными в документах HTML?

Question

У меня есть скрипт веб-пакета

const webpack = require('webpack');
const path = require('path');

module.exports = (env, options) => ({
  entry: "./clickscape.js",
  output: {
    path: path.resolve(__dirname, '../priv/static/js'),
    filename: 'clickscape-bundle.js'
  },
  plugins: [
    new webpack.ProvidePlugin({
      $: 'jquery',
      jQuery: 'jquery'
    })
  ]
})

, который генерирует пакет.Внутри моего clickscape.js есть функции, к которым я хочу иметь доступ на HTML-странице, на которой загружен пакет, т.е., не очевидно, что звонить за ее пределами.

Что мне нужно сделать, чтобы мои звонки работали?

Answer 1

Если такая переменная не является глобальной, вы не можете.Как правило, это хорошо, так как предотвращает конфликты имен между вашими переменными и другими (внешними) сценариями.

Внутри моего клика по клику.js есть функции, к которым я хочу иметь доступна HTML-странице, на которой загружен пакет (...)

Если вы обязательно хотите получить к ним доступ на HTML-странице, вы можете сделать их глобальными в ./clickscape.js:

window.do_something_clickscape_dot_js = function() {
    // your code
}

Теперь do_something_clickscape_dot_js() работает на вашей HTML-странице.Но почему бы не позвонить прямо в ./clickscape.js?

const do_something_clickscape_dot_js = () => {
    // do something here
}

/*
 * calling the function in this file has same effect as calling it
 * in script tag in the HTML page
 */
do_something_clickscape_dot_js();

Я не могу вспомнить случай использования, когда вы обязательно захотите вызвать его на HTML-странице, но если вы хотите:глобальный характер.