button

src/App.vue

 <template>
-<n-loading-bar-provider>
-  <n-message-provider>
-    <n-notification-provider>
-      <n-dialog-provider>
-        <demo />
-      </n-dialog-provider>
-    </n-notification-provider>
-  </n-message-provider>
-</n-loading-bar-provider>
+	<n-loading-bar-provider>
+		<n-message-provider>
+			<n-notification-provider>
+				<n-dialog-provider>
+					<demo />
+				</n-dialog-provider>
+			</n-notification-provider>
+		</n-message-provider>
+	</n-loading-bar-provider>
 </template>
 
 <script>
-import { defineComponent } from "vue";
-import Demo from "./Demo.vue";
+	import {
+		defineComponent
+	} from "vue";
+	import Demo from "./Demo.vue";
 
-export default defineComponent({
-components: {
-  Demo,
-},
-});
+	export default defineComponent({
+		components: {
+			Demo,
+		},
+	});
 </script>

src/Demo.vue

@@ -7,4 +7,20 @@
     <n-button type="warning">Warning</n-button>
     <n-button type="error">Error</n-button>
   </n-space>
-</template>
+
+  <n-space>
+    <n-button dashed>Default</n-button>
+    <n-button type="primary" dashed>Primary</n-button>
+    <n-button type="info" dashed>Info</n-button>
+    <n-button type="success" dashed>Success</n-button>
+    <n-button type="warning" dashed>Warning</n-button>
+    <n-button type="error" dashed>Error</n-button>
+  </n-space>
+
+  <n-space align="baseline">
+    <n-button size="tiny">小小</n-button>
+    <n-button size="small">小</n-button>
+    <n-button size="medium">不小</n-button>
+    <n-button size="large">不不小</n-button>
+  </n-space>
+</template>
\ No newline at end of file

src/main.js

@@ -6,5 +6,4 @@ const app = createApp(App);
 
 app.use(naive);
 
-app.mount("#app");
-
+app.mount("#app");
\ No newline at end of file