commit 14223e89c57592e9d030a962bba9e9ca85b2a75c Author: pan <1029559041@qq.com> Date: Mon Feb 15 02:58:35 2021 +0800 init diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..e05420f --- /dev/null +++ b/.gitignore @@ -0,0 +1,8 @@ +node_modules +.DS_Store +dist +dist-ssr +*.local +/yarn.lock +*.log +.idea diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..729764b --- /dev/null +++ b/Dockerfile @@ -0,0 +1,12 @@ +FROM nginx:alpine + +ADD vue.app.conf /etc/nginx/conf.d/ + +ADD dist /app + +RUN mv /etc/nginx/conf.d/default.conf /etc/nginx/conf.d/default.bak \ +&& dos2unix /etc/nginx/conf.d/vue.app.conf + +EXPOSE 9000 + +ENTRYPOINT ["nginx","-g","daemon off;"] \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..11603f8 --- /dev/null +++ b/index.html @@ -0,0 +1,13 @@ + + + + + + + Vite App + + +
+ + + diff --git a/mock/test.ts b/mock/test.ts new file mode 100644 index 0000000..9d1f6a3 --- /dev/null +++ b/mock/test.ts @@ -0,0 +1,29 @@ +import {MockMethod} from 'vite-plugin-mock'; +import {sendCodeApi} from "../src/interface"; + + +const Mock = require('mockjs') + +export default [ + { + url: sendCodeApi, + method: 'post', + response: ({ query }) => { + return Mock.mock({ + 'result':'OK', + 'message':'验证码发送成功' + }) + }, + }, + { + url: '/api/post', + method: 'post', + timeout: 2000, + response: { + code: 0, + data: { + name: 'vben', + }, + }, + }, +] as MockMethod[]; \ No newline at end of file diff --git a/package.json b/package.json new file mode 100644 index 0000000..ebf8069 --- /dev/null +++ b/package.json @@ -0,0 +1,30 @@ +{ + "name": "bililive_webapp", + "version": "0.0.0", + "scripts": { + "dev": "vite", + "build": "vuedx-typecheck . && vite build", + "serve": "vite preview" + }, + "dependencies": { + "element3": "^0.0.39", + "mockjs": "^1.1.0", + "vue": "^3.0.5", + "vue-router": "4", + "vuex": "^4.0.0" + }, + "devDependencies": { + "@vitejs/plugin-vue": "^1.1.4", + "@vue/compiler-sfc": "^3.0.5", + "@vuedx/typecheck": "^0.6.0", + "@vuedx/typescript-plugin-vue": "^0.6.0", + "cross-env": "^7.0.3", + "node-sass": "^5.0.0", + "sass": "^1.32.7", + "sass-loader": "^11.0.1", + "style-loader": "^2.0.0", + "typescript": "^4.1.3", + "vite": "^2.0.0-beta.64", + "vite-plugin-mock": "^2.1.4" + } +} diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000..df36fcf Binary files /dev/null and b/public/favicon.ico differ diff --git a/src/App.vue b/src/App.vue new file mode 100644 index 0000000..dbbcc29 --- /dev/null +++ b/src/App.vue @@ -0,0 +1,51 @@ + + + + + \ No newline at end of file diff --git a/src/assets/logo.png b/src/assets/logo.png new file mode 100644 index 0000000..f3d2503 Binary files /dev/null and b/src/assets/logo.png differ diff --git a/src/assets/scss/style.scss b/src/assets/scss/style.scss new file mode 100644 index 0000000..af86527 --- /dev/null +++ b/src/assets/scss/style.scss @@ -0,0 +1,11 @@ +.mt{ + &-1{ + margin-top: 1rem; + } +} + +.btn-block{ + display: block; + width: 100%; +} + diff --git a/src/components/AsyncComponent.vue b/src/components/AsyncComponent.vue new file mode 100644 index 0000000..aa9b474 --- /dev/null +++ b/src/components/AsyncComponent.vue @@ -0,0 +1,28 @@ + + + + + \ No newline at end of file diff --git a/src/components/Email.vue b/src/components/Email.vue new file mode 100644 index 0000000..7411bc6 --- /dev/null +++ b/src/components/Email.vue @@ -0,0 +1,110 @@ + + + + + \ No newline at end of file diff --git a/src/components/Home.vue b/src/components/Home.vue new file mode 100644 index 0000000..fc68eea --- /dev/null +++ b/src/components/Home.vue @@ -0,0 +1,13 @@ + + + + + \ No newline at end of file diff --git a/src/components/Vue3.vue b/src/components/Vue3.vue new file mode 100644 index 0000000..72a9f9d --- /dev/null +++ b/src/components/Vue3.vue @@ -0,0 +1,49 @@ + + + + + \ No newline at end of file diff --git a/src/interface.ts b/src/interface.ts new file mode 100644 index 0000000..bfcc396 --- /dev/null +++ b/src/interface.ts @@ -0,0 +1 @@ +export const sendCodeApi='/api/change/email' \ No newline at end of file diff --git a/src/main.ts b/src/main.ts new file mode 100644 index 0000000..f708889 --- /dev/null +++ b/src/main.ts @@ -0,0 +1,11 @@ +import {createApp} from 'vue' +// TypeScript error? Run VSCode command +// TypeScript: Select TypeScript version - > Use Workspace Version +import App from './App.vue' +import Element3 from 'element3' +import 'element3/lib/theme-chalk/index.css' +import './assets/scss/style.scss' +import {store} from "./store"; +import {router} from "./router"; + +createApp(App).use(router).use(store).use(Element3).mount('#app') diff --git a/src/request.ts b/src/request.ts new file mode 100644 index 0000000..51c4881 --- /dev/null +++ b/src/request.ts @@ -0,0 +1,13 @@ +import {sendCodeApi} from "./interface"; + +/** + * 发送验证码 + * @param userEmail + */ +export function sendCode(userEmail:string){ + return fetch(new Request(sendCodeApi,{method:'POST',body:JSON.stringify({userEmail})})) +} + +export function changeEmail(oldEmail:string,newEmail:string,code:string){ + +} \ No newline at end of file diff --git a/src/router.ts b/src/router.ts new file mode 100644 index 0000000..2a8f67f --- /dev/null +++ b/src/router.ts @@ -0,0 +1,22 @@ +// 1. 定义路由组件. +// 也可以从其他文件导入 +import {createRouter, createWebHashHistory} from "vue-router"; +import Email from "./components/Email.vue"; +import Home from "./components/Home.vue"; + +// 2. 定义一些路由 +// 每个路由都需要映射到一个组件。 +// 我们后面再讨论嵌套路由。 +const routes = [ + {path:'/',component: Home}, + { path: '/email', component: Email }, +] + +// 3. 创建路由实例并传递 `routes` 配置 +// 你可以在这里输入更多的配置，但我们在这里 +// 暂时保持简单 +export const router = createRouter({ + // 4. 内部提供了 history 模式的实现。为了简单起见，我们在这里使用 hash 模式。 + history: createWebHashHistory(), + routes, // `routes: routes` 的缩写 +}) diff --git a/src/store.ts b/src/store.ts new file mode 100644 index 0000000..6e58590 --- /dev/null +++ b/src/store.ts @@ -0,0 +1,16 @@ +import {createStore} from "vuex"; + +export const store = createStore({ + state: () => ({ + user: { + email: '1029559041@qq.com' + } + }), + mutations: { + setUser(state, user) { + // @ts-ignore + state.user = user + } + } + +}) \ No newline at end of file diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..8c7115f --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,14 @@ +{ + "compilerOptions": { + "target": "esnext", + "module": "esnext", + "moduleResolution": "node", + "strict": true, + "jsx": "preserve", + "sourceMap": true, + "lib": ["esnext", "dom"], + "types": ["vite/client"], + "plugins": [{ "name": "@vuedx/typescript-plugin-vue" }] + }, + "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"] +} diff --git a/vite.config.ts b/vite.config.ts new file mode 100644 index 0000000..fc5c6fb --- /dev/null +++ b/vite.config.ts @@ -0,0 +1,9 @@ +import {defineConfig} from 'vite' +import vue from '@vitejs/plugin-vue' +import {viteMockServe} from "vite-plugin-mock"; + + +// https://vitejs.dev/config/ +export default defineConfig({ + plugins: [vue(),viteMockServe({})] +}) diff --git a/vue.app.conf b/vue.app.conf new file mode 100644 index 0000000..5f1feff --- /dev/null +++ b/vue.app.conf @@ -0,0 +1,9 @@ +server { + listen 9000; + + location / { + root /app; + index index.html; + try_files $uri $uri/ /index.html last; + } +} \ No newline at end of file