twitter-bootstrap 将 Bootstrap 更新到版本 3 - 我必须做什么?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17974998/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 17:47:07  来源:igfitidea点击:

Updating Bootstrap to version 3 - what do I have to do?

twitter-bootstraptwitter-bootstrap-3

提问by henry

I'm new to Bootstrap and have the older version 2.3.2.

我是 Bootstrap 的新手并且拥有旧版本 2.3.2。

Version 3 has been released. Do I just simply replace the CSS and Javascript files if I want to use the latest version?

版本 3 已经发布。如果我想使用最新版本,我是否只是简单地替换 CSS 和 Javascript 文件?

回答by Bass Jobsen

  1. Download the latest version from http://getbootstrap.com/OR Replace the css and js files with the newest versions or use CDN (http://www.bootstrapcdn.com/)

  2. Migrate your html, yes indeed read http://bootply.com/bootstrap-3-migration-guide. You could try http://twitterbootstrapmigrator.w3masters.nl/or http://code.divshot.com/bootstrap3_upgrader/(provide checklist too)

  3. remove html5shiv cause TB drops support for IE7 and Firefox 3.xadd html5shiv.js to add support of HTML5 elements to IE8

  4. add respond.js (https://github.com/scottjehl/Respond) for media query support in IE. NOTE this won't work with CDN, see: IE8 issue with Twitter Bootstrap 3

  5. If you use Glyphicons, you will have to add them from http://glyphicons.getbootstrap.com/( icons have been moved to a separate repository.)Glyphicons are back since RC2 (180 glyphs in font format from the Glyphicon Halflings set)

  6. If you use the Javascript Typeahead component, you will have to integrate https://github.com/twitter/typeahead.js/(cause typeahead javascript is dropped) See also: Typeahead problems with Bootstrap 3.0 RC1Or use the "old" plugin: https://github.com/bassjobsen/Bootstrap-3-Typeahead, see also: https://stackoverflow.com/questions/18615964/ajax-call-in-bootstrap-3-0-typeahead/18620473

  7. Switch to the latest version of jQuery 1.x(don't use the 2.x version cause jQuery 2.x don't support IE8)

  8. If you use third party widgets which adds or insert html to your code (like addthis.com, sharethis.com and Google maps), create a wrapper for the box-sizing, see: Right border of the AddThis counter missing with Twitter's Bootstrap 3

  1. http://getbootstrap.com/下载最新版本或将 css 和 js 文件替换为最新版本或使用 CDN ( http://www.bootstrapcdn.com/)

  2. 迁移您的 html,确实阅读http://bootply.com/bootstrap-3-migration-guide。您可以尝试http://twitterbootstrapmigrator.w3masters.nl/http://code.divshot.com/bootstrap3_upgrader/(也提供清单)

  3. 删除 html5shiv 导致 TB 不再支持 IE7 和 Firefox 3.x添加 html5shiv.js 以向 IE8 添加对 HTML5 元素的支持

  4. 添加 response.js ( https://github.com/scottjehl/Respond) 以支持 IE 中的媒体查询。注意这不适用于 CDN,请参阅:Twitter Bootstrap 3 的 IE8 问题

  5. 如果您使用 Glyphicons,则必须从http://glyphicons.getbootstrap.com/添加它们(图标已移至单独的存储库。)自 RC2 起 Glyphicon 又回来了(来自 Glyphicon Halflings 集的字体格式的 180 个字形)

  6. 如果您使用 Javascript Typeahead 组件,则必须集成https://github.com/twitter/typeahead.js/(因为 typeahead javascript 被删除)另请参阅:Bootstrap 3.0 RC1 的 Typeahead 问题或使用“旧”插件:https://github.com/bassjobsen/Bootstrap-3-Typeahead,另见:https://stackoverflow.com/questions/18615964/ajax-call-in-bootstrap-3-0-typeahead/18620473

  7. 切换到最新版本的jQuery 1.x(不要使用 2.x 版本,因为 jQuery 2.x 不支持 IE8)

  8. 如果您使用向您的代码添加或插入 html 的第三方小部件(如 addthis.com、sharethis.com 和 Google 地图),请为盒子大小创建一个包装器,请参阅:Twitter 的 Bootstrap 3 缺少 AddThis 计数器的右边框

Other:

其他:

Bootstrap 3 switch to box-sizing: border-box why?: https://stackoverflow.com/a/18858771/1596547

Bootstrap 3 切换到 box-sizing:border-box 为什么?:https: //stackoverflow.com/a/18858771/1596547

Note support for IE7 has been dropped. https://github.com/coliff/bootstrap-ie7try to add the css part back with use of some conditional CSS.

注意对 IE7 的支持已被删除。https://github.com/coliff/bootstrap-ie7尝试使用一些条件 CSS 重新添加 css 部分。

回答by Zim

Updated 2018

2018 年更新

Bootstrap 3 to 4

引导程序 3 到 4

Bootstrap 4 upgrade tool(this will help to migrate from Bootstrap 3 to 4)

Bootstrap 4 升级工具(这将有助于从 Bootstrap 3 迁移到 4)



Bootstrap 2 to 3

引导程序 2 到 3

A release candidate (not the final release 3) for Bootstap 3 RC 1 was announced Friday (July 26 2013), so there is not yet any official migration guidance.

周五(2013 年 7 月 26 日)宣布了 Bootstap 3 RC 1 的候选版本(不是最终版本 3),因此目前还没有任何官方迁移指南。

There are major changes for Bootstrap 3. There is no backwards compatibility with 2.x, so you can't just replace the files. You can however find some useful guidance here at Bootply:

Bootstrap 3 有重大变化。没有与 2.x 的向后兼容性,因此您不能只是替换文件。但是,您可以在 Bootply 上找到一些有用的指导:

http://bootply.com/bootstrap-3-migration-guide

http://bootply.com/bootstrap-3-migration-guide

There is also a Bootstrap migration tool in the works: https://github.com/iatek/bootstrap-migrate

还有一个Bootstrap迁移工具正在开发中:https: //github.com/iatek/bootstrap-migrate

Bootstrap 2.x to 3 upgrade tool: http://upgrade-bootstrap.bootply.com/v3

Bootstrap 2.x to 3 升级工具:http: //upgrade-bootstrap.bootply.com/v3

回答by albanx

it is almost impossible to migrate from bootstrap 2.3 to 3.0. the version change is very drastic. I tried to update my zend framework 2 project with bootstrap 3.0 and the results was a mess (like trying to open with IE 5).

从 bootstrap 2.3 迁移到 3.0 几乎是不可能的。版本变化非常剧烈。我试图用 bootstrap 3.0 更新我的 zend 框架 2 项目,结果一团糟(就像试图用 IE 5 打开)。

My advice: old project using bootstrap 2.X let with bootstrap 2.x. New starting project, start with 3.0.

我的建议:旧项目使用 bootstrap 2.x let 和 bootstrap 2.x。新的启动项目,从3.0开始。

In my opinion such version change was a very big error from bootstrap team. They should have done a gradual update 2.4, 2.5, 2.6 ....

在我看来,这样的版本更改是 bootstrap 团队的一个非常大的错误。他们应该做一个渐进的更新 2.4, 2.5, 2.6 ....

回答by Ramesh

I just migrated to 3.0.3 and this python app https://pypi.python.org/pypi/b2tob3/0.4made it pretty easy task.

我刚刚迁移到 3.0.3,这个 python 应用程序https://pypi.python.org/pypi/b2tob3/0.4让它变得非常简单。

回答by jdewit

I made a grunt plugin to automate upgrading bootstrap 2.3 to 3.0 html.

我制作了一个 grunt 插件来自动将 bootstrap 2.3 升级到 3.0 html。

Check it out at https://github.com/jdewit/grunt-html-upgrader

https://github.com/jdewit/grunt-html-upgrader查看

回答by Kumar Ramalingam

It's not sure but use this rereplacer joomla extension

不确定,但请使用此替换器 joomla 扩展

refer this link,

参考这个链接,

http://www.nonumber.nl/extensions/rereplacer

http://www.nonumber.nl/extensions/rereplacer

otherwise, Template overrides are the only way to do this.

否则,模板覆盖是唯一的方法。

回答by u911838

Two online tools to Upgrade to Bootstrap 3:

升级到 Bootstrap 3 的两个在线工具:

FROM bootply

从引导

FROM divshot

FROM divshot

回答by Osify

If you are having a big application with a lot of files with a lot of customization, every single tool likely that could not answer to most of the case you are facing.

如果您有一个包含大量自定义文件的大型应用程序,那么每个工具都可能无法解决您面临的大多数情况。

First, of course, I recommend to try: https://pypi.python.org/pypi/b2tob3/0.4but this won't answer to my need, I forked this version and adapt my own one to be able to migrate together Bootstrap 2 to 3 and Font Awesome 3 to 4 together, some cases that not treat in b23tob3-v0.4 (original one) are trying to treat in my version.

首先,当然,我建议尝试:https: //pypi.python.org/pypi/b2tob3/0.4但这不能满足我的需要,我分叉了这个版本并调整了自己的版本以便能够一起迁移Bootstrap 2 to 3 和 Font Awesome 3 to 4 一起使用,一些在 b23tob3-v0.4(原始版本)中没有处理的情况正试图在我的版本中处理。

Read my post here: http://ask.osify.com/qa/589Find my update in github: https://github.com/metrey/b2tob3You can also find the compiled Windows app there as well to use right away.

在此处阅读我的帖子:http: //ask.osify.com/qa/589在 github 中查找我的更新:https: //github.com/metrey/b2tob3您还可以在那里找到已编译的 Windows 应用程序并立即使用.

ALWAYS backup your files and commit everything in to source control before using the tool.

在使用该工具之前,始终备份您的文件并将所有内容提交到源代码管理中。

Good luck and share your though.

祝你好运,分享你的虽然。