JS, Browserify: функция не определена

#javascript #html #browserify

Вопрос:

У меня есть файлы, представленные:

 -js/
    - calc.js
    - tool.js
-index.html
 

calc.js является узловым модулем следующей структуры:

 module.exports = {
   calculate: function() {...},
   getPrecision: function() {...}
}
 

и tool.js используйте require и добавляйте некоторые функции, например:

 const fpcalc = require('./fpcalc');

function changeState() {
//some code using fpcalc
}
 

Я использовал Browserify для создания bundle.js и добавил его в качестве src-скрипта.
Одна из моих кнопок на HTML — странице используется onclick=changeState() . После нажатия я получаю

 ReferenceError: changeState is not defined
at HTMLAnchorElement.onclick
 

Это почему? Есть ли какой-нибудь другой способ заставить это работать?

Ответ №1:

Функция «Состояние изменений» не экспортируется в ваш tool.js. Это означает, что он виден только внутри вашего bundle.js, но не снаружи.

Взгляните на это: https://makerlog.org/posts/creating-js-library-builds-with-browserify-and-other-npm-modules

В нем показано, как открыть свой код в глобальном пространстве имен в javascript.

Комментарии:

1. Его нужно повторно упаковывать каждый раз, когда я редактирую файл? Ты что, издеваешься надо мной?

Ответ №2:

Вот очень простой способ заставить его работать так, как вы хотите.

 const fpcalc = require('./fpcalc');

window.changeState = () => {
    //some code using fpcalc
}
 

Ответ №3:

У меня та же ошибка, вот мой рабочий пример.

mac, browserify https://github.com/perliedman/reproject

  1. Необходимо использовать sudo установку глобально

    sudo npm install -g brwoserify

    https://github.com/perliedman/reproject

    sudo npm install reproject // install locally is fine

    Необходимо вручную создать папку «dist» для последующего использования выходного файла

  2. Необходимо --s использовать функцию глобальной переменной « reproject и или « toWgs84 , которую вы будете использовать позже в браузере js.

    Без --s этого появится » reproject неопределенная ошибка . https://makerlog.org/posts/creating-js-library-builds-with-browserify-and-other-npm-modules browserify --help отобразит список всех опций.
    -o означает каталог выходного файла

    browserify node_modules/reproject/index.js --s reproject -o node_modules/reproject/dist/reproject.js

Тег HTML-скрипта включает в себя ваш вышеуказанный dist/reproject.js

Теперь вы не получите неопределенную ошибку «reproejct»

 return reproject(_geometry_, ___from_projection, proj4.WGS84, crss)