From: Haoqun Jiang <haoqunjiang@gmail.com>
Date: Wed, 11 Aug 2021 08:20:47 +0000 (+0800)
Subject: fix: fix js HelloWorld template
X-Git-Tag: v3.0.0-alpha.2~5
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=793adb0c3d63149f292787f1c5cbf9db06e315c3;p=thirdparty%2Fvuejs%2Fcreate-vue.git

fix: fix js HelloWorld template
---

diff --git a/playground/default/src/components/HelloWorld.vue b/playground/default/src/components/HelloWorld.vue
index 36a089f1..51f81a8f 100644
--- a/playground/default/src/components/HelloWorld.vue
+++ b/playground/default/src/components/HelloWorld.vue
@@ -1,17 +1,24 @@
 <template>
   <h1>{{ msg }}</h1>
 
+  <p>
+    Recommended IDE setup:
+    <a href="https://code.visualstudio.com/" target="_blank">VSCode</a>
+    +
+    <a href="https://github.com/johnsoncodehk/volar" target="_blank">Volar</a>
+  </p>
+
+  <p>See <code>README.md</code> for more information.</p>
+
   <p>
     <a href="https://vitejs.dev/guide/features.html" target="_blank">
-      Vite Documentation
+      Vite Docs
     </a>
     |
-    <a href="https://v3.vuejs.org/" target="_blank">Vue 3 Documentation</a>
+    <a href="https://v3.vuejs.org/" target="_blank">Vue 3 Docs</a>
   </p>
 
-  <button type="button" @click="state.count++">
-    count is: {{ state.count }}
-  </button>
+  <button type="button" @click="count++">count is: {{ count }}</button>
   <p>
     Edit
     <code>components/HelloWorld.vue</code> to test hot module replacement.
@@ -35,4 +42,16 @@ const count = ref(0)
 a {
   color: #42b983;
 }
+
+label {
+  margin: 0 0.5em;
+  font-weight: bold;
+}
+
+code {
+  background-color: #eee;
+  padding: 2px 4px;
+  border-radius: 4px;
+  color: #304455;
+}
 </style>
diff --git a/playground/jsx/src/components/HelloWorld.vue b/playground/jsx/src/components/HelloWorld.vue
index 36a089f1..51f81a8f 100644
--- a/playground/jsx/src/components/HelloWorld.vue
+++ b/playground/jsx/src/components/HelloWorld.vue
@@ -1,17 +1,24 @@
 <template>
   <h1>{{ msg }}</h1>
 
+  <p>
+    Recommended IDE setup:
+    <a href="https://code.visualstudio.com/" target="_blank">VSCode</a>
+    +
+    <a href="https://github.com/johnsoncodehk/volar" target="_blank">Volar</a>
+  </p>
+
+  <p>See <code>README.md</code> for more information.</p>
+
   <p>
     <a href="https://vitejs.dev/guide/features.html" target="_blank">
-      Vite Documentation
+      Vite Docs
     </a>
     |
-    <a href="https://v3.vuejs.org/" target="_blank">Vue 3 Documentation</a>
+    <a href="https://v3.vuejs.org/" target="_blank">Vue 3 Docs</a>
   </p>
 
-  <button type="button" @click="state.count++">
-    count is: {{ state.count }}
-  </button>
+  <button type="button" @click="count++">count is: {{ count }}</button>
   <p>
     Edit
     <code>components/HelloWorld.vue</code> to test hot module replacement.
@@ -35,4 +42,16 @@ const count = ref(0)
 a {
   color: #42b983;
 }
+
+label {
+  margin: 0 0.5em;
+  font-weight: bold;
+}
+
+code {
+  background-color: #eee;
+  padding: 2px 4px;
+  border-radius: 4px;
+  color: #304455;
+}
 </style>
diff --git a/playground/vuex-with-tests/src/components/HelloWorld.vue b/playground/vuex-with-tests/src/components/HelloWorld.vue
index 36a089f1..51f81a8f 100644
--- a/playground/vuex-with-tests/src/components/HelloWorld.vue
+++ b/playground/vuex-with-tests/src/components/HelloWorld.vue
@@ -1,17 +1,24 @@
 <template>
   <h1>{{ msg }}</h1>
 
+  <p>
+    Recommended IDE setup:
+    <a href="https://code.visualstudio.com/" target="_blank">VSCode</a>
+    +
+    <a href="https://github.com/johnsoncodehk/volar" target="_blank">Volar</a>
+  </p>
+
+  <p>See <code>README.md</code> for more information.</p>
+
   <p>
     <a href="https://vitejs.dev/guide/features.html" target="_blank">
-      Vite Documentation
+      Vite Docs
     </a>
     |
-    <a href="https://v3.vuejs.org/" target="_blank">Vue 3 Documentation</a>
+    <a href="https://v3.vuejs.org/" target="_blank">Vue 3 Docs</a>
   </p>
 
-  <button type="button" @click="state.count++">
-    count is: {{ state.count }}
-  </button>
+  <button type="button" @click="count++">count is: {{ count }}</button>
   <p>
     Edit
     <code>components/HelloWorld.vue</code> to test hot module replacement.
@@ -35,4 +42,16 @@ const count = ref(0)
 a {
   color: #42b983;
 }
+
+label {
+  margin: 0 0.5em;
+  font-weight: bold;
+}
+
+code {
+  background-color: #eee;
+  padding: 2px 4px;
+  border-radius: 4px;
+  color: #304455;
+}
 </style>
diff --git a/playground/vuex/src/components/HelloWorld.vue b/playground/vuex/src/components/HelloWorld.vue
index 36a089f1..51f81a8f 100644
--- a/playground/vuex/src/components/HelloWorld.vue
+++ b/playground/vuex/src/components/HelloWorld.vue
@@ -1,17 +1,24 @@
 <template>
   <h1>{{ msg }}</h1>
 
+  <p>
+    Recommended IDE setup:
+    <a href="https://code.visualstudio.com/" target="_blank">VSCode</a>
+    +
+    <a href="https://github.com/johnsoncodehk/volar" target="_blank">Volar</a>
+  </p>
+
+  <p>See <code>README.md</code> for more information.</p>
+
   <p>
     <a href="https://vitejs.dev/guide/features.html" target="_blank">
-      Vite Documentation
+      Vite Docs
     </a>
     |
-    <a href="https://v3.vuejs.org/" target="_blank">Vue 3 Documentation</a>
+    <a href="https://v3.vuejs.org/" target="_blank">Vue 3 Docs</a>
   </p>
 
-  <button type="button" @click="state.count++">
-    count is: {{ state.count }}
-  </button>
+  <button type="button" @click="count++">count is: {{ count }}</button>
   <p>
     Edit
     <code>components/HelloWorld.vue</code> to test hot module replacement.
@@ -35,4 +42,16 @@ const count = ref(0)
 a {
   color: #42b983;
 }
+
+label {
+  margin: 0 0.5em;
+  font-weight: bold;
+}
+
+code {
+  background-color: #eee;
+  padding: 2px 4px;
+  border-radius: 4px;
+  color: #304455;
+}
 </style>
diff --git a/playground/with-tests/src/components/HelloWorld.vue b/playground/with-tests/src/components/HelloWorld.vue
index 36a089f1..51f81a8f 100644
--- a/playground/with-tests/src/components/HelloWorld.vue
+++ b/playground/with-tests/src/components/HelloWorld.vue
@@ -1,17 +1,24 @@
 <template>
   <h1>{{ msg }}</h1>
 
+  <p>
+    Recommended IDE setup:
+    <a href="https://code.visualstudio.com/" target="_blank">VSCode</a>
+    +
+    <a href="https://github.com/johnsoncodehk/volar" target="_blank">Volar</a>
+  </p>
+
+  <p>See <code>README.md</code> for more information.</p>
+
   <p>
     <a href="https://vitejs.dev/guide/features.html" target="_blank">
-      Vite Documentation
+      Vite Docs
     </a>
     |
-    <a href="https://v3.vuejs.org/" target="_blank">Vue 3 Documentation</a>
+    <a href="https://v3.vuejs.org/" target="_blank">Vue 3 Docs</a>
   </p>
 
-  <button type="button" @click="state.count++">
-    count is: {{ state.count }}
-  </button>
+  <button type="button" @click="count++">count is: {{ count }}</button>
   <p>
     Edit
     <code>components/HelloWorld.vue</code> to test hot module replacement.
@@ -35,4 +42,16 @@ const count = ref(0)
 a {
   color: #42b983;
 }
+
+label {
+  margin: 0 0.5em;
+  font-weight: bold;
+}
+
+code {
+  background-color: #eee;
+  padding: 2px 4px;
+  border-radius: 4px;
+  color: #304455;
+}
 </style>
diff --git a/template/code/default/src/components/HelloWorld.vue b/template/code/default/src/components/HelloWorld.vue
index 36a089f1..51f81a8f 100644
--- a/template/code/default/src/components/HelloWorld.vue
+++ b/template/code/default/src/components/HelloWorld.vue
@@ -1,17 +1,24 @@
 <template>
   <h1>{{ msg }}</h1>
 
+  <p>
+    Recommended IDE setup:
+    <a href="https://code.visualstudio.com/" target="_blank">VSCode</a>
+    +
+    <a href="https://github.com/johnsoncodehk/volar" target="_blank">Volar</a>
+  </p>
+
+  <p>See <code>README.md</code> for more information.</p>
+
   <p>
     <a href="https://vitejs.dev/guide/features.html" target="_blank">
-      Vite Documentation
+      Vite Docs
     </a>
     |
-    <a href="https://v3.vuejs.org/" target="_blank">Vue 3 Documentation</a>
+    <a href="https://v3.vuejs.org/" target="_blank">Vue 3 Docs</a>
   </p>
 
-  <button type="button" @click="state.count++">
-    count is: {{ state.count }}
-  </button>
+  <button type="button" @click="count++">count is: {{ count }}</button>
   <p>
     Edit
     <code>components/HelloWorld.vue</code> to test hot module replacement.
@@ -35,4 +42,16 @@ const count = ref(0)
 a {
   color: #42b983;
 }
+
+label {
+  margin: 0 0.5em;
+  font-weight: bold;
+}
+
+code {
+  background-color: #eee;
+  padding: 2px 4px;
+  border-radius: 4px;
+  color: #304455;
+}
 </style>