Я использую Bootstrap V4, и в консоли регистрируется следующая ошибка;
Ошибка: всплывающие подсказки Bootstrap требуют Tether ( http://github.hubspot.com/tether/ )
Я попытался удалить ошибку, установив Tether, но это не сработало. Я «установил» Tether, включив следующие строки кода;
<link rel="stylesheet" href="http://www.atlasestateagents.co.uk/css/tether.min.css">
<script src="http://www.atlasestateagents.co.uk/javascript/tether.min.js"></script>
Правильно ли я установил трос?
Может кто-нибудь помочь мне удалить эту ошибку?
Если вы хотите просмотреть ошибку на моем сайте, нажмите здесь и загрузите консоль.
javascript
twitter-bootstrap
bootstrap-4
tether
Майкл Л.Б.
источник
источник
Ответы:
Для стабильной версии Bootstrap 4:
Поскольку бета Bootstrap 4 зависит не от Tether, а от Popper.js . Все скрипты ( должны быть в этом порядке):
См. Текущую документацию для новейших версий скриптов.
Только Bootstrap 4 alpha:
Bootstrap 4 альфа нуждается Tether , поэтому вам необходимо включить ,
tether.min.js
прежде чем включитьbootstrap.min.js
, например.источник
mutating the [[Prototype]] of an object will cause your code to run very slowly; instead create the object with the correct initial [[Prototype]] value using Object.create'
bootstrap.min.js
библиотеки. Это все еще появляется, если вы закомментируете это. Да, я бы отправил новый вопрос, если у Google нет решения. :)https://npmcdn.com/tether@1.2.4/dist/
иhttps://npmcdn.com/bootstrap@4.0.0-alpha.2/dist/
Если вы используете Webpack:
webpack.config.js:
Источник
источник
Если вы используете npm и browserify:
источник
Лично я использую небольшое подмножество функций Bootstrap и мне не нужно подключать Tether.
Это должно помочь:
источник
window.Tether = window.Tether || {};
? Кроме того, в вашем решении есть предостережение, что оно может стереть уже определенную зависимость в глобальной области видимости, если модуль будет загружен до того, как ваша вещь будет выполнена.window.Tether = window.Tether || {};
хуже, потому что его выкинетTether is not a function
, а не содержательная ошибка.Если вы хотите избежать сообщения об ошибке и не используете подсказки Bootstrap, вы можете определить window.Tether перед загрузкой Bootstrap.
источник
window.Tether = {}; define(['tether'], function (Tether) { return window.Tether = Tether; });
Вы должны сделать мое руководство:
1. Добавьте нижеприведенный источник в Gemfile
Команда выполнения:
комплектация
Добавьте эту строку после jQuery в application.js.
// = требуется jquery
// = требуется привязь
Перезапустите сервер рельсов.
источник
Установите трос через npm, как показано ниже
затем добавьте привязку к вашему html выше начальной загрузки как ниже
источник
bower install tether --save-dev
npm install tether --save
вместо--save-dev
? Это будет необходимо и в производстве.Для веб-пакета я решил это с
webpack.config.js
:источник
Дополнительное примечание. Если вы проверите несжатый файл JavaScript, вы найдете условие:
Таким образом, сообщение об ошибке содержит необходимую информацию.
Несжатая версия:
https://rawgit.com/HubSpot/tether/master/src/js/tether.js https://rawgit.com/HubSpot/tether/master/dist/css/tether.css
источник
Используя веб-пакет, я использовал это в
webpack.config.js
:Кажется, это
Tether
был тот, который он искал:источник
tether: 'tether',
У меня возникла эта проблема с requirejs, использующим новейшую сборку boostrap 4. Я просто определил:
в моем HTML-теге головы, чтобы обмануть проверку начальной загрузки. Затем я добавил второе требование require непосредственно перед требованием, которое загружает мое приложение, и впоследствии мою зависимость при начальной загрузке:
Используя оба из них в тандеме, у вас не должно возникнуть проблем с использованием текущей сборки начальной загрузки 4.
источник
Работает для генератора-aspnetcore-spa и начальной загрузки 4.
источник
Для webpack 1 или 2 с Bootstrap 4 вам нужно
источник
Если вы используете Brunch, вы можете добавить это в конце вашего
brunch-config.js
:источник
Если вы используете загрузчик AMD require.js:
источник
Для пользователей Laravel Mix, использующих Bootstrap4, вам нужно будет запустить
Затем обновите вас,
resources/assets/js/bootstrap.js
чтобы загрузить Tether и перенести его в объект окна.Вот как выглядит моя: (Обратите внимание, мне тоже пришлось бежать
npm install popper.js --save
)источник
Добавить к ответу @ adilapapaya. Для
ember-cli
пользователей, в частности, установитьtether
си затем включите его в свой
ember-cli-build.js
файл перед загрузкой, вот так:источник
И если вы используете webpack, вам понадобится плагин expose. Добавьте в ваш webpack.config.js этот загрузчик
источник
У меня была такая же проблема, и вот как я ее решил. Я на рельсах 5.1.0rc1
Убедитесь, что вы добавили require jquery и tether в ваш файл application.js, они должны быть в самом верху, как это
Просто убедитесь, что трос установлен
источник
Метод № 1 : загрузите отсюда и вставьте его в свои проекты, или
метод № 2 : используйте приведенный ниже код перед исходным кодом сценария начальной загрузки:
источник
Я рекомендую следовать инструкциям в документации Bootstrap 4 :
источник
Решение UMD / AMD
Для тех парней, которые делают это через UMD и компилируют через
require.js
, есть лаконичное решение.В модуле, который требует
tether
в качестве зависимости, которая загружаетсяTooltip
как UMD, перед определением модуля, просто поместите короткий фрагмент определения Tether:Этот короткий фрагмент в самом начале, на самом деле, может быть помещен на любой более высокий уровень вашего приложения, самое главное - вызывать его перед фактическим использованием
bootstrap
компонентов сTether
зависимостью.UPD: в Boostrap 4.1 Stable они заменили Tether на Popper.js , см. Документацию по использованию .
источник
У меня была та же проблема, и я решил ее, включив jquery-3.1.1.min перед тем, как включить js, и это сработало как шарм. Надеюсь, поможет.
источник