Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit874103c

Browse files
committed
chore(example): update vue example
1 parentd8ff6a1 commit874103c

32 files changed

+205
-7482
lines changed

‎examples/all-features/app5/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
"@vue/compiler-sfc":"3.0.0",
1818
"css-loader":"5.0.1",
1919
"file-loader":"6.1.1",
20-
"html-webpack-plugin":"4.5.0",
20+
"html-webpack-plugin":"^5.5.0",
2121
"mini-css-extract-plugin":"1.2.1",
2222
"url-loader":"4.1.1",
2323
"vue-loader":"16.0.0-beta.8",

‎examples/react-in-vue/app1/src/Layout.js‎renamed to ‎examples/all-features/app5/src/Layout.js‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,12 @@
1-
import{ref}from"vue";
2-
importReactButtonfrom"./ReactButton";
1+
import{defineAsyncComponent,ref}from"vue";
2+
3+
constButton=defineAsyncComponent(()=>import('app6/src/components/Button'));
34

45
exportdefault{
56
name:"Layout",
6-
components:{ ReactButton},
7+
components:{
8+
App6Button:Button,
9+
},
710
setup(){
811
constshowButton=ref(true);
912
constbuttonText=ref("React button");
@@ -36,10 +39,8 @@ export default {
3639
</div>
3740
</div>
3841
<div>
39-
<h2>React Button - loaded via Module Federation</h2>
40-
<div class="remote-component">
41-
<react-button v-if="showButton" :text="buttonText" :onClick="incrementCount" />
42-
</div>
42+
<h2>Button - loaded via Module Federation</h2>
43+
<app6-button />
4344
</div>
4445
</div>
4546
`,

‎examples/all-features/app5/src/Layout.vue‎

Lines changed: 0 additions & 41 deletions
This file was deleted.
-12.5 KB
Binary file not shown.

‎examples/all-features/app5/src/main.js‎

Lines changed: 14 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,21 @@
1-
import{createApp,defineAsyncComponent}from'vue';
21
import{boot}from'fronts';
3-
importLayoutfrom'./Layout.vue';
2+
import{createApp}from'vue';
3+
importLayoutfrom'./Layout';
44

5-
constContent=defineAsyncComponent(()=>
6-
import('app6/src/components/Content')
7-
);
8-
constButton=defineAsyncComponent(()=>import('app6/src/components/Button'));
5+
constApp={
6+
components:{
7+
layout:Layout,
8+
},
9+
template:`
10+
<h1>Vue</h1>
11+
<div class="app">
12+
<layout />
13+
</div>
14+
`,
15+
};
916

1017
exportdefaultfunctionrender(element){
11-
constapp=createApp(Layout);
12-
app.component('content-element',Content);
13-
app.component('button-element',Button);
18+
constapp=createApp(App);
1419
app.mount(element);
1520
return()=>{
1621
app.unmount(element);

‎examples/all-features/app5/webpack.config.js‎

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -12,22 +12,14 @@ module.exports = (env = {}) => createWebpackConfig({
1212
minimize:false,
1313
},
1414
target:"web",
15-
entry:path.resolve(__dirname,"./src/main.js"),
16-
// output: {
17-
// path: path.resolve(__dirname, './dist'),
18-
// publicPath: '/dist/'
19-
// },
15+
entry:path.resolve(__dirname,"./src/bootstrap.js"),
2016
output:{
2117
publicPath:"auto",
2218
},
2319
resolve:{
2420
extensions:[".vue",".jsx",".js",".json"],
2521
alias:{
26-
// this isn't technically needed, since the default `vue` entry for bundlers
27-
// is a simple `export * from '@vue/runtime-dom`. However having this
28-
// extra re-export somehow causes webpack to always invalidate the module
29-
// on the first HMR update and causes the page to reload.
30-
vue:"@vue/runtime-dom",
22+
vue:"vue/dist/vue.esm-bundler.js",
3123
},
3224
},
3325
module:{

‎examples/all-features/app6/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
"@vue/compiler-sfc":"3.0.0",
1818
"css-loader":"5.0.1",
1919
"file-loader":"6.1.1",
20-
"html-webpack-plugin":"4.5.0",
20+
"html-webpack-plugin":"^5.5.0",
2121
"mini-css-extract-plugin":"1.2.1",
2222
"url-loader":"4.1.1",
2323
"vue-loader":"16.0.0-beta.8",
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
{
22
"name":"app6",
3-
"exports": ["./src/components/Content","./src/components/Button"]
3+
"exports": ["./src/components/Button"]
44
}
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
importButtonfrom'./components/Button';
2+
3+
exportconstApp={
4+
components:{
5+
App6Button:Button,
6+
},
7+
template:`
8+
<h1>App6 with Vue</h1>
9+
<div class="app">
10+
<app6-button />
11+
</div>
12+
`,
13+
};

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp