Skip to content

Commit 77cb1fa

Browse files
committed
feature #746 Added Vue3 support (weaverryan)
This PR was squashed before being merged into the master branch. Discussion ---------- Added Vue3 support Hi! Vue3 is now beta. I think Encore should support Vue2 and Vue 3... at least for awhile. The changes needed to make Webpack work with v3 are not that many: 1) Make sure the user installs `vue/compiler-sfc` instead of `vue-template-compiler` 2) require `VueLoaderPlugin` in a slightly different way 3) Add a slightly different "alias" for vue You can choose the version with a new `version` option to `enableVue()`. Otherwise, it will configure itself correctly if you have vue2 or vue3 installed, or it will (finally) recommend the vue2 install instructions. When v3 comes out, we would change the default recommendation to be v3. But... getting the code (and test suite) to work with both vue2 and vue3 is quite tricky :). Commits ------- 40f8ae8 bumping to use vue 2.5.0 to avoid test inconsistency 5abb25d forcing exact low version 06782ae Merge branch 'master' into vue3-support e51165d correctly clearing logger before asserting 449a0af removing vue3 alias 33d2ac5 fixing bad vue-beta version 24f7652 Upgrading to Webpack 4.22.0 which has a fix for ordering problems 43f66c9 lint fixes 35e508f Forcing vue installation to include @3 or @2 version constraint on yarn add command d49352b changing order of entrypoints files d7903e4 updating test hashes 7d2917e fixing missing return bc182bd fixing lock file 63cfd1a fixing wrong path change in tests 08509da removing vue3 and jsx support for now c344809 Fixing missing-loader for vue-loader 16 85d42cd working around a bug in vue-loader by putting module styles first c9f83bc fixing bad test path 6f83868 updating lock file e702197 hack to test with vue3 and vue2 e376be2 various test fixes 8d07790 WIP Vue3 support
2 parents 2658151 + 40f8ae8 commit 77cb1fa

File tree

34 files changed

+673
-147
lines changed

34 files changed

+673
-147
lines changed

fixtures/vuejs-css-modules/App.vue

Lines changed: 30 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,36 @@
11
<template>
2-
<div id="app" class="red large justified lowercase block" :class="[$css.italic, $scss.bold, $less.underline, $stylus.rtl, $postcss.hidden]"></div>
2+
<div class="red large justified lowercase block" :class="[$css.italic, $scss.bold, $less.underline, $stylus.rtl, $postcss.hidden]"></div>
33
</template>
44

5+
<style module="$css">
6+
.italic {
7+
font-style: italic;
8+
}
9+
</style>
10+
11+
<style lang="scss" module="$scss">
12+
.bold {
13+
font-weight: bold;
14+
}
15+
</style>
16+
17+
<style lang="less" module="$less">
18+
.underline {
19+
text-decoration: underline;
20+
}
21+
</style>
22+
23+
<style lang="styl" module="$stylus">
24+
.rtl
25+
direction: rtl;
26+
</style>
27+
28+
<style lang="postcss" module="$postcss">
29+
.hidden {
30+
visibility: hidden;
31+
}
32+
</style>
33+
534
<style>
635
.red {
736
color: red;
@@ -30,33 +59,3 @@
3059
display: block;
3160
}
3261
</style>
33-
34-
35-
<style module="$css">
36-
.italic {
37-
font-style: italic;
38-
}
39-
</style>
40-
41-
<style lang="scss" module="$scss">
42-
.bold {
43-
font-weight: bold;
44-
}
45-
</style>
46-
47-
<style lang="less" module="$less">
48-
.underline {
49-
text-decoration: underline;
50-
}
51-
</style>
52-
53-
<style lang="styl" module="$stylus">
54-
.rtl
55-
direction: rtl;
56-
</style>
57-
58-
<style lang="postcss" module="$postcss">
59-
.hidden {
60-
visibility: hidden;
61-
}
62-
</style>

fixtures/vuejs-css-modules/main_v3.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import { createApp } from 'vue';
2+
import App from './App'
3+
4+
createApp(App).mount('#app');
File renamed without changes.
File renamed without changes.

fixtures/vuejs/main_v3.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import { createApp } from 'vue';
2+
import App from './App'
3+
4+
createApp(App).mount('#app');

0 commit comments

Comments
 (0)