Skip to content

Commit 971f696

Browse files
committed
wip: pending link
1 parent 8552650 commit 971f696

File tree

8 files changed

+110
-17
lines changed

8 files changed

+110
-17
lines changed

src/lts/index.md

+43
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
# Vue 2 LTS, EOL & Extended Support
2+
3+
## How long will Vue 2 be supported?
4+
5+
Vue 2.7 is the current, and final minor release of Vue 2.x. Vue 2.7 receives 18 months of LTS (long-term support) starting from its release date on July 1st, 2022. During this period, Vue 2 will receive necessary bug and security fixes, but will no longer receive new features.
6+
7+
**Vue 2 will reach End of Life (EOL) on December 31st, 2023**. After that date, Vue 2 will continue to be available in all existing distribution channels (CDNs and package managers), but will no longer receive updates, including security and browser compatibility fixes.
8+
9+
## Options for dealing with EOL
10+
11+
### Upgrade to Vue 3
12+
13+
Vue 3 is the current, latest major version of Vue. It provides better performance, better TypeScript support, and contains new features that are not present in Vue 2, such as Teleport, Suspense, and multiple root elements per template.
14+
15+
Vue 3 contains breaking changes that make it incompatible with Vue 2, so migration will require a certain level of effort depending on your project. Full details are documented in the [Vue 3 Migration Guide](https://v3-migration.vuejs.org/).
16+
17+
Despite the breaking changes, the majority of Vue APIs are shared between the two major versions, so most of your team's Vue 2 knowledge will continue to work in Vue 3. In the long run, we also intend to avoid major breaking upgrades like the one between Vue 2 and Vue 3. Compatibility and ecosystem stability will be our topmost priority for future releases, and new features will be introduced in a way that does not require major migrations.
18+
19+
### Stay on Vue 2
20+
21+
Some teams may not be able to upgrade to Vue 3 by this timeline due to limited bandwidth, budget, risk tolerance, or reliance on Vue-3-incompatible dependencies. We totally understand this, and want to ensure that staying on Vue 2 beyond EOL is a viable option.
22+
23+
#### The Technical Perspective
24+
25+
From a technical perspective, Vue 2 is a stable and battle-tested piece of technology. If it is serving you well now, it will continue to do so for the foreseeable future.
26+
27+
In addition, we have backported some of the most important Vue 3 features to [Vue 2.7](/v2/guide/migration-vue-2-7.html), including Composition API and `<script setup>`. This allows Vue 2 projects to improve scalability, leverage new ecosystem libraries, and better prepare for potential migration to Vue 3.
28+
29+
Vue 2.7 will also be the maintained release before EOL hits, so if you intend to stay on Vue 2, you should at least upgrade to Vue 2.7.
30+
31+
#### Security & Compliance
32+
33+
For some teams, the main concern lies in security, compliance, and browser compatibility.
34+
35+
- You won't receive security fixes from EOL software. For the record, Vue 2 hasn't really had any real vulnerabilities in the past, but you may need a supported version to fullfil regulations or company policies.
36+
37+
- If you are shipping your application to customers with SLAs. You *will* want to avoid including EOL software in your stack.
38+
39+
- Browsers sometimes ship changes that break legacy libraries. This is extremely rare, but could happen in theory.
40+
41+
To address these concerns, we have partnered with industry experts to provide **Extended LTS for Vue 2**. This service will provide a version of Vue 2 that will continue to receive security and browser compatibility fixes, with SLAs (Service Level Agreements). If you expect to be using Vue 2 beyond the EOL date of December 31st, 2023, make sure to plan ahead.
42+
43+
[Learn more about Extended LTS for Vue 2](TODO:link).

src/v2/guide/migration-vue-2-7.md

+3-1
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ type: guide
44
order: 704
55
---
66

7+
Vue 2.7 is the latest minor version of Vue 2. It provides built-in support for the [Composition API](https://vuejs.org/guide/extras/composition-api-faq.html#composition-api-faq).
8+
79
Despite Vue 3 now being the default version, we understand that there are still many users who have to stay on Vue 2 due to dependency compatibility, browser support requirements, or simply not enough bandwidth to upgrade. In Vue 2.7, we have backported some of the most important features from Vue 3 so that Vue 2 users can benefit from them as well.
810

911
## Backported Features
@@ -115,4 +117,4 @@ Vue Devtools 6.2.0 has added support for inspecting 2.7 Composition API state, b
115117

116118
As stated before, 2.7 is the final minor release of Vue 2.x. After this release, Vue 2 has entered LTS (long-term support) which lasts for 18 months from now, and will no longer receive new features.
117119

118-
This means **Vue 2 will reach End of Life by the end of 2023**. We believe this should provide plenty of time for most of the ecosystem to migrate over to Vue 3. However, we also understand that there could be teams or projects that cannot upgrade by this timeline while still need to fullfil security and compliance requirements. We are planning to provide extended support for Vue 2 for teams with such needs - if your team expects to be using Vue 2 beyond end of 2023, make sure to plan head and register your interest [here](https://airtable.com/shrj37Zf4ZIfrxFzh).
120+
This means **Vue 2 will reach End of Life on December 31st, 2023**. We believe this should provide plenty of time for most of the ecosystem to migrate over to Vue 3. However, we also understand that there could be teams or projects that cannot upgrade by this timeline while still need to fullfil security and compliance requirements. If your team expects to be using Vue 2 beyond end of 2023, make sure to plan head and understand your options: learn more about [Vue 2 LTS and Extended Support](/lts/).

themes/vue/layout/partials/ecosystem_dropdown.ejs

+1-2
Original file line numberDiff line numberDiff line change
@@ -24,10 +24,9 @@
2424
<li><h4>News</h4></li>
2525
<li><ul>
2626
<li><a href="https://news.vuejs.org" class="nav-link" target="_blank" rel="noopener">Weekly News</a></li>
27-
<li><a href="https://github.com/vuejs/vue/projects/6" class="nav-link" target="_blank" rel="noopener">Roadmap</a></li>
2827
<li><a href="https://events.vuejs.org/" class="nav-link" target="_blank" rel="noopener">Events</a></li>
2928
<li><a href="https://twitter.com/vuejs" class="nav-link" target="_blank" rel="noopener">Twitter</a></li>
30-
<li><a href="https://medium.com/the-vue-point" class="nav-link" target="_blank" rel="noopener">Blog</a></li>
29+
<li><a href="https://blog.vuejs.org" class="nav-link" target="_blank" rel="noopener">Blog</a></li>
3130
<li><a href="https://vuejobs.com/?ref=vuejs" class="nav-link" target="_blank" rel="noopener">Jobs</a></li>
3231
<li><a href="https://dev.to/t/vue" class="nav-link" target="_blank" rel="noopener">DEV Community</a></li>
3332
</ul></li>

themes/vue/layout/partials/header.ejs

+6-3
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,11 @@
11
<div>
22
<div id="v3-banner">
3-
<span class="hidden-sm">You’re browsing Vue 2 docs.</span>
4-
Learn more about <a href="/v2/guide/migration-vue-2-7.html">Vue 2.7</a> or
5-
go to <a href="https://vuejs.org/">Vue 3 docs</a>.
3+
<span class="hidden-sm">You’re browsing Vue 2 docs. Go to </span>
4+
<a href="https://vuejs.org/">Vue 3 docs</a>
5+
<span class="hidden-sm">, or learn more about</span><span class="only-sm"> | </span>
6+
<a href="/v2/guide/migration-vue-2-7.html">Vue 2.7</a>
7+
<span class="hidden-sm">and</span><span class="only-sm"> | </span>
8+
<a href="/lts/">Extended LTS</a><span class="hidden-sm">.</span>
69
</div>
710

811
<header id="header">

themes/vue/layout/partials/main_menu.ejs

+2-6
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,8 @@
55
</li>
66
<%- partial('partials/learn_dropdown') %>
77
<%- partial('partials/ecosystem_dropdown') %>
8+
<%- partial('partials/resources_dropdown') %>
89
<li>
9-
<a href="<%- url_for("/v2/guide/team.html") %>" class="nav-link team<%- page.path.match(/team\.html/) ? ' current' : '' %>">Team</a>
10+
<a href="/lts/" class="badge-parent">Extended LTS<sup class="badge">NEW</sup></a>
1011
</li>
11-
<%- partial('partials/resources_dropdown') %>
12-
<!-- <li>
13-
<a href="<%- url_for("/partners") %>" class="nav-link <%- page.path.match(/partners/) ? 'current' : '' %>">Partners</a>
14-
</li> -->
15-
<%- partial('partials/support_vue_dropdown') %>
1612
<%- partial('partials/language_dropdown') %>
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,39 @@
11
<li class="nav-dropdown-container resources">
22
<a href="#" class="nav-link">Resources</a><span class="arrow"></span>
33
<ul class="nav-dropdown">
4-
<li><a href="<%- url_for("/resources/partners.html") %>" class="nav-link">Partners</a></li>
5-
<li><a href="<%- url_for("/resources/themes.html") %>" class="nav-link">Themes</a></li>
6-
<li><a href="https://github.com/vuejs/awesome-vue" class="nav-link" target="_blank" rel="noopener">Awesome Vue</a></li>
7-
<li><a href="https://awesomejs.dev/for/vue/" class="nav-link" target="_blank" rel="noopener">Browse packages for Vue</a></li>
4+
<li>
5+
<a
6+
href="https://vuejs.org/about/team.html"
7+
class="nav-link team<%- page.path.match(/team\.html/) ? ' current' : '' %>"
8+
>Team</a
9+
>
10+
</li>
11+
<li>
12+
<a href="https://vuejs.org/sponsor/">Sponsor</a>
13+
</li>
14+
<li><a href="https://vuejs.org/partners/" class="nav-link">Partners</a></li>
15+
<li>
16+
<a href="https://vuejs.org/resources/themes.html" class="nav-link"
17+
>Themes</a
18+
>
19+
</li>
20+
<li>
21+
<a
22+
href="https://github.com/vuejs/awesome-vue"
23+
class="nav-link"
24+
target="_blank"
25+
rel="noopener"
26+
>Awesome Vue</a
27+
>
28+
</li>
29+
<li>
30+
<a
31+
href="https://awesomejs.dev/for/vue/"
32+
class="nav-link"
33+
target="_blank"
34+
rel="noopener"
35+
>Browse packages for Vue</a
36+
>
37+
</li>
838
</ul>
939
</li>

themes/vue/layout/sponsors-page.ejs

+1-1
Original file line numberDiff line numberDiff line change
@@ -96,7 +96,7 @@ Recurring pledges come with exclusive perks, e.g. having your name listed in the
9696
<h3 id="special-sponsors-china">Platinum Sponsors (China)</h3>
9797

9898
<p class="platinum">
99-
<%_ for (const sponsor of theme.platinum_china) {_%>
99+
<%_ for (const sponsor of theme.platinum_china || []) {_%>
100100
<a href="<%- sponsor.url %>" target="_blank" rel="noopener">
101101
<img src="<%- logo(sponsor.img) %>"<%- (sponsor.big_width || sponsor.big_height) ? ` style="${sponsor.big_width ? `width:${sponsor.big_width};`: ``}${sponsor.big_height ? `height:${sponsor.big_height};` : ``}"` : `` %>>
102102
</a>

themes/vue/source/css/_header.styl

+20
Original file line numberDiff line numberDiff line change
@@ -34,10 +34,15 @@ red-dot-before(leftPos = -8px)
3434
a
3535
color: #7adeb2
3636
font-weight: bold
37+
.only-sm
38+
display: none
39+
margin: 0 5px
3740

3841
@media screen and (max-width: 900px)
3942
.hidden-sm
4043
display: none
44+
.only-sm
45+
display: inline
4146

4247
body.docs
4348
#header
@@ -84,6 +89,21 @@ body.docs
8489
left: 8px
8590
&.new::before
8691
red-dot-before(8px)
92+
a.badge-parent
93+
padding-right 26px
94+
position relative
95+
sup.badge
96+
position absolute
97+
top -4px
98+
margin-left 4px
99+
background-color $green
100+
color #fff
101+
height 14px
102+
font-size 10px
103+
line-height 1
104+
font-weight bold
105+
border-radius 4px
106+
padding 3px 4px 0
87107

88108
.nav-link
89109
padding-bottom: 3px

0 commit comments

Comments
 (0)