Commit 2b11cec27bd9b264ab6333f2a33af3a1a9bb68af
1 parent
cd0050a6
Exists in
master
【工具】GM工具
Showing
6 changed files
with
83 additions
and
5 deletions
Show diff stats
index.html
@@ -4,7 +4,7 @@ | @@ -4,7 +4,7 @@ | ||
4 | <meta charset="UTF-8"> | 4 | <meta charset="UTF-8"> |
5 | <link rel="icon" href="/favicon.ico" /> | 5 | <link rel="icon" href="/favicon.ico" /> |
6 | <meta name="viewport" content="width=device-width, initial-scale=1.0"> | 6 | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
7 | - <title>Vite App</title> | 7 | + <title>海滩管理工具</title> |
8 | </head> | 8 | </head> |
9 | <body> | 9 | <body> |
10 | <div id="app"></div> | 10 | <div id="app"></div> |
package-lock.json
@@ -8,6 +8,8 @@ | @@ -8,6 +8,8 @@ | ||
8 | "name": "ht-gm", | 8 | "name": "ht-gm", |
9 | "version": "0.0.0", | 9 | "version": "0.0.0", |
10 | "dependencies": { | 10 | "dependencies": { |
11 | + "@popperjs/core": "^2.11.8", | ||
12 | + "bootstrap": "^5.3.3", | ||
11 | "vue": "^3.0.4" | 13 | "vue": "^3.0.4" |
12 | }, | 14 | }, |
13 | "devDependencies": { | 15 | "devDependencies": { |
@@ -252,6 +254,15 @@ | @@ -252,6 +254,15 @@ | ||
252 | "node": ">= 8" | 254 | "node": ">= 8" |
253 | } | 255 | } |
254 | }, | 256 | }, |
257 | + "node_modules/@popperjs/core": { | ||
258 | + "version": "2.11.8", | ||
259 | + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", | ||
260 | + "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==", | ||
261 | + "funding": { | ||
262 | + "type": "opencollective", | ||
263 | + "url": "https://opencollective.com/popperjs" | ||
264 | + } | ||
265 | + }, | ||
255 | "node_modules/@rollup/plugin-commonjs": { | 266 | "node_modules/@rollup/plugin-commonjs": { |
256 | "version": "16.0.0", | 267 | "version": "16.0.0", |
257 | "resolved": "https://registry.npmjs.org/@rollup/plugin-commonjs/-/plugin-commonjs-16.0.0.tgz", | 268 | "resolved": "https://registry.npmjs.org/@rollup/plugin-commonjs/-/plugin-commonjs-16.0.0.tgz", |
@@ -825,6 +836,24 @@ | @@ -825,6 +836,24 @@ | ||
825 | "readable-stream": "^3.4.0" | 836 | "readable-stream": "^3.4.0" |
826 | } | 837 | } |
827 | }, | 838 | }, |
839 | + "node_modules/bootstrap": { | ||
840 | + "version": "5.3.3", | ||
841 | + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.3.tgz", | ||
842 | + "integrity": "sha512-8HLCdWgyoMguSO9o+aH+iuZ+aht+mzW0u3HIMzVu7Srrpv7EBBxTnrFlSCskwdY1+EOFQSm7uMJhNQHkdPcmjg==", | ||
843 | + "funding": [ | ||
844 | + { | ||
845 | + "type": "github", | ||
846 | + "url": "https://github.com/sponsors/twbs" | ||
847 | + }, | ||
848 | + { | ||
849 | + "type": "opencollective", | ||
850 | + "url": "https://opencollective.com/bootstrap" | ||
851 | + } | ||
852 | + ], | ||
853 | + "peerDependencies": { | ||
854 | + "@popperjs/core": "^2.11.8" | ||
855 | + } | ||
856 | + }, | ||
828 | "node_modules/brace-expansion": { | 857 | "node_modules/brace-expansion": { |
829 | "version": "1.1.11", | 858 | "version": "1.1.11", |
830 | "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", | 859 | "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", |
package.json
@@ -6,10 +6,12 @@ | @@ -6,10 +6,12 @@ | ||
6 | "build": "vite build" | 6 | "build": "vite build" |
7 | }, | 7 | }, |
8 | "dependencies": { | 8 | "dependencies": { |
9 | + "@popperjs/core": "^2.11.8", | ||
10 | + "bootstrap": "^5.3.3", | ||
9 | "vue": "^3.0.4" | 11 | "vue": "^3.0.4" |
10 | }, | 12 | }, |
11 | "devDependencies": { | 13 | "devDependencies": { |
12 | - "vite": "^1.0.0-rc.13", | ||
13 | - "@vue/compiler-sfc": "^3.0.4" | 14 | + "@vue/compiler-sfc": "^3.0.4", |
15 | + "vite": "^1.0.0-rc.13" | ||
14 | } | 16 | } |
15 | -} | ||
16 | \ No newline at end of file | 17 | \ No newline at end of file |
18 | +} |
src/App.vue
1 | <template> | 1 | <template> |
2 | - <img alt="Vue logo" src="./assets/logo.png" /> | 2 | + <ToolTitle msg="Hello Vue 3.0 + Vite" /> |
3 | <HelloWorld msg="Hello Vue 3.0 + Vite" /> | 3 | <HelloWorld msg="Hello Vue 3.0 + Vite" /> |
4 | </template> | 4 | </template> |
5 | 5 | ||
6 | <script> | 6 | <script> |
7 | +import ToolTitle from './components/ToolTitle.vue' | ||
7 | import HelloWorld from './components/HelloWorld.vue' | 8 | import HelloWorld from './components/HelloWorld.vue' |
8 | 9 | ||
9 | export default { | 10 | export default { |
10 | name: 'App', | 11 | name: 'App', |
11 | components: { | 12 | components: { |
13 | + ToolTitle, | ||
12 | HelloWorld | 14 | HelloWorld |
13 | } | 15 | } |
14 | } | 16 | } |
@@ -0,0 +1,43 @@ | @@ -0,0 +1,43 @@ | ||
1 | +<template> | ||
2 | + <nav class="navbar navbar-expand-sm bg-dark navbar-dark"> | ||
3 | + <!-- Brand --> | ||
4 | + <a class="navbar-brand" href="#">Logo</a> | ||
5 | + | ||
6 | + <!-- Links --> | ||
7 | + <ul class="navbar-nav"> | ||
8 | + <li class="nav-item"> | ||
9 | + <a class="nav-link" href="#">Link 1</a> | ||
10 | + </li> | ||
11 | + <li class="nav-item"> | ||
12 | + <a class="nav-link" href="#">Link 2</a> | ||
13 | + </li> | ||
14 | + | ||
15 | + <!-- Dropdown --> | ||
16 | + <li class="nav-item dropdown"> | ||
17 | + <a class="nav-link dropdown-toggle" href="#" id="navbardrop" data-bs-toggle="dropdown"> | ||
18 | + Dropdown link | ||
19 | + </a> | ||
20 | + <div class="dropdown-menu"> | ||
21 | + <a class="dropdown-item" href="#">Link 1</a> | ||
22 | + <a class="dropdown-item" href="#">Link 2</a> | ||
23 | + <a class="dropdown-item" href="#">Link 3</a> | ||
24 | + </div> | ||
25 | + </li> | ||
26 | + </ul> | ||
27 | + </nav> | ||
28 | + | ||
29 | +</template> | ||
30 | + | ||
31 | +<script> | ||
32 | +export default { | ||
33 | + name: 'ToolTitle', | ||
34 | + props: { | ||
35 | + msg: String | ||
36 | + }, | ||
37 | + data() { | ||
38 | + return { | ||
39 | + count: 0 | ||
40 | + } | ||
41 | + } | ||
42 | +} | ||
43 | +</script> |
src/main.js
1 | import { createApp } from 'vue' | 1 | import { createApp } from 'vue' |
2 | import App from './App.vue' | 2 | import App from './App.vue' |
3 | import './index.css' | 3 | import './index.css' |
4 | +import 'bootstrap' | ||
5 | +import 'bootstrap/dist/css/bootstrap.min.css' | ||
4 | 6 | ||
5 | createApp(App).mount('#app') | 7 | createApp(App).mount('#app') |