mirror of
https://github.com/blacktunes/sr-ghostly-grove.git
synced 2025-01-07 03:07:03 +08:00
init
This commit is contained in:
blacktunes
commit
691450cd31
15
.eslintrc.cjs
Normal file
15
.eslintrc.cjs
Normal file
@ -0,0 +1,15 @@
|
||||
/* eslint-env node */
|
||||
require('@rushstack/eslint-patch/modern-module-resolution')
|
||||
|
||||
module.exports = {
|
||||
root: true,
|
||||
'extends': [
|
||||
'plugin:vue/vue3-essential',
|
||||
'eslint:recommended',
|
||||
'@vue/eslint-config-typescript',
|
||||
'@vue/eslint-config-prettier/skip-formatting'
|
||||
],
|
||||
parserOptions: {
|
||||
ecmaVersion: 'latest'
|
||||
}
|
||||
}
|
||||
28
.gitignore
vendored
Normal file
28
.gitignore
vendored
Normal file
@ -0,0 +1,28 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
dist-ssr
|
||||
coverage
|
||||
*.local
|
||||
|
||||
/cypress/videos/
|
||||
/cypress/screenshots/
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
19
.prettierrc.json5
Normal file
19
.prettierrc.json5
Normal file
@ -0,0 +1,19 @@
|
||||
{
|
||||
"$schema": "https://json.schemastore.org/prettierrc",
|
||||
// JS
|
||||
"semi": false,
|
||||
"tabWidth": 2,
|
||||
"singleQuote": true,
|
||||
"printWidth": 100,
|
||||
"trailingComma": "none",
|
||||
"singleAttributePerLine": true,
|
||||
"endOfLine": "auto",
|
||||
// stylus
|
||||
"plugins": [
|
||||
"prettier-plugin-stylus-supremacy"
|
||||
],
|
||||
"stylusSupremacy.insertColons": false,
|
||||
"stylusSupremacy.insertSemicolons": false,
|
||||
"stylusSupremacy.insertBraces": false,
|
||||
"stylusSupremacy.tabStopChar": " "
|
||||
}
|
||||
8
.vscode/extensions.json
vendored
Normal file
8
.vscode/extensions.json
vendored
Normal file
@ -0,0 +1,8 @@
|
||||
{
|
||||
"recommendations": [
|
||||
"Vue.volar",
|
||||
"Vue.vscode-typescript-vue-plugin",
|
||||
"dbaeumer.vscode-eslint",
|
||||
"esbenp.prettier-vscode"
|
||||
]
|
||||
}
|
||||
46
README.md
Normal file
46
README.md
Normal file
@ -0,0 +1,46 @@
|
||||
# vite-template
|
||||
|
||||
This template should help get you started developing with Vue 3 in Vite.
|
||||
|
||||
## Recommended IDE Setup
|
||||
|
||||
[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
|
||||
|
||||
## Type Support for `.vue` Imports in TS
|
||||
|
||||
TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
|
||||
|
||||
If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
|
||||
|
||||
1. Disable the built-in TypeScript Extension
|
||||
1) Run `Extensions: Show Built-in Extensions` from VSCode's command palette
|
||||
2) Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
|
||||
2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.
|
||||
|
||||
## Customize configuration
|
||||
|
||||
See [Vite Configuration Reference](https://vitejs.dev/config/).
|
||||
|
||||
## Project Setup
|
||||
|
||||
```sh
|
||||
pnpm install
|
||||
```
|
||||
|
||||
### Compile and Hot-Reload for Development
|
||||
|
||||
```sh
|
||||
pnpm dev
|
||||
```
|
||||
|
||||
### Type-Check, Compile and Minify for Production
|
||||
|
||||
```sh
|
||||
pnpm build
|
||||
```
|
||||
|
||||
### Lint with [ESLint](https://eslint.org/)
|
||||
|
||||
```sh
|
||||
pnpm lint
|
||||
```
|
||||
8
env.d.ts
vendored
Normal file
8
env.d.ts
vendored
Normal file
@ -0,0 +1,8 @@
|
||||
/// <reference types="vite/client" />
|
||||
|
||||
interface Window {
|
||||
BUILD_TIME: Date
|
||||
}
|
||||
|
||||
/** 构建时间 */
|
||||
declare const BUILD_TIME: number
|
||||
13
index.html
Normal file
13
index.html
Normal file
@ -0,0 +1,13 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Vite App</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
36
package.json
Normal file
36
package.json
Normal file
@ -0,0 +1,36 @@
|
||||
{
|
||||
"name": "sr-ghostly-grove",
|
||||
"version": "0.0.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "run-p type-check \"build-only {@}\" --",
|
||||
"preview": "vite preview",
|
||||
"build-only": "vite build",
|
||||
"type-check": "vue-tsc --noEmit -p tsconfig.app.json --composite false",
|
||||
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
|
||||
"format": "prettier --write src/"
|
||||
},
|
||||
"dependencies": {
|
||||
"vue": "^3.3.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@rushstack/eslint-patch": "^1.3.3",
|
||||
"@tsconfig/node18": "^18.2.2",
|
||||
"@types/node": "^18.18.5",
|
||||
"@vitejs/plugin-vue": "^4.4.0",
|
||||
"@vitejs/plugin-vue-jsx": "^3.0.2",
|
||||
"@vue/eslint-config-prettier": "^8.0.0",
|
||||
"@vue/eslint-config-typescript": "^12.0.0",
|
||||
"@vue/tsconfig": "^0.4.0",
|
||||
"eslint": "^8.49.0",
|
||||
"eslint-plugin-vue": "^9.17.0",
|
||||
"npm-run-all2": "^6.1.1",
|
||||
"prettier": "^3.0.3",
|
||||
"typescript": "~5.2.0",
|
||||
"vite": "^4.4.11",
|
||||
"vue-tsc": "^1.8.19",
|
||||
"prettier-plugin-stylus-supremacy": "^1.0.4",
|
||||
"stylus": "^0.55.0"
|
||||
}
|
||||
}
|
||||
3140
pnpm-lock.yaml
Normal file
3140
pnpm-lock.yaml
Normal file
File diff suppressed because it is too large
Load Diff
BIN
public/favicon.ico
Normal file
BIN
public/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
78
src/App.vue
Normal file
78
src/App.vue
Normal file
@ -0,0 +1,78 @@
|
||||
<template>
|
||||
<div
|
||||
class="main"
|
||||
:style="{
|
||||
width: `${width * scale}px`,
|
||||
height: `${(height + bottom) * scale}px`
|
||||
}"
|
||||
>
|
||||
<div
|
||||
class="home"
|
||||
:style="{
|
||||
transform: `scale(${scale})`,
|
||||
width: `${width}px`,
|
||||
height: `${height}px`
|
||||
}"
|
||||
>
|
||||
<Component
|
||||
v-for="(item, index) in components"
|
||||
:key="index"
|
||||
:is="item"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<Tip :show="shouldHorizontal" />
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { defineComponent, ref } from 'vue'
|
||||
import type { Component } from 'vue'
|
||||
import Tip from './components/Tip.vue'
|
||||
|
||||
// 动态加载所有组件
|
||||
const components: Component[] = []
|
||||
const modules = {
|
||||
...import.meta.glob<{ default: Component }>(
|
||||
[
|
||||
// 组件位置
|
||||
'./components/*.vue',
|
||||
'!./components/Tip.vue',
|
||||
'./components/Popup/*.vue'
|
||||
],
|
||||
{
|
||||
eager: true,
|
||||
import: 'default'
|
||||
}
|
||||
)
|
||||
}
|
||||
for (const i in modules) {
|
||||
components.push(defineComponent(modules[i]))
|
||||
}
|
||||
|
||||
// 计算窗口尺寸
|
||||
const width = 3200
|
||||
const height = (width / 16) * 9
|
||||
const bottom = 100
|
||||
const scale = ref(1)
|
||||
|
||||
const shouldHorizontal = ref(false)
|
||||
|
||||
const setSize = () => {
|
||||
shouldHorizontal.value = window.innerWidth <= 550 && window.innerWidth < window.innerHeight
|
||||
scale.value = Math.min(window.innerWidth / width, window.innerHeight / (height + bottom))
|
||||
}
|
||||
setSize()
|
||||
|
||||
window.onresize = () => {
|
||||
setSize()
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.main
|
||||
.home
|
||||
position relative
|
||||
height 100%
|
||||
width 100%
|
||||
transform-origin left top
|
||||
</style>
|
||||
70
src/components/Tip.vue
Normal file
70
src/components/Tip.vue
Normal file
@ -0,0 +1,70 @@
|
||||
<template>
|
||||
<transition name="fade">
|
||||
<div
|
||||
class="horizontal-tip"
|
||||
v-if="isShow && show"
|
||||
@click.stop="isShow = false"
|
||||
>
|
||||
<div class="bg"></div>
|
||||
<div class="content">
|
||||
<svg
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="100"
|
||||
height="100"
|
||||
>
|
||||
<path
|
||||
d="M832 448l-128-128h96V224a32 32 0 0 0-32-32h-192V128h192a96 96 0 0 1 96 96v96h96zM448 160a32 32 0 0 0-32-32H160a32 32 0 0 0-32 32v288H64V160a96 96 0 0 1 96-96h256a96 96 0 0 1 96 96v288h-64V160zM160 512h704a96 96 0 0 1 96 96v256a96 96 0 0 1-96 96H160a96 96 0 0 1-96-96v-256a96 96 0 0 1 96-96zM128 864a32 32 0 0 0 32 32h704a32 32 0 0 0 32-32v-256a32 32 0 0 0-32-32H160a32 32 0 0 0-32 32v256z"
|
||||
fill="#666666"
|
||||
></path>
|
||||
</svg>
|
||||
<div style="font-size: 30px; margin-top: 10px; text-align: center">
|
||||
建议解除方向锁定后横屏使用
|
||||
</div>
|
||||
<div style="font-size: 10px; margin: 5px 0">(点击屏幕关闭提示)</div>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue'
|
||||
|
||||
defineProps<{
|
||||
show: boolean
|
||||
}>()
|
||||
|
||||
const isShow = ref(true)
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.horizontal-tip
|
||||
position fixed
|
||||
top 0
|
||||
left 0
|
||||
width 100vw
|
||||
height 100vh
|
||||
display flex
|
||||
justify-content center
|
||||
align-items center
|
||||
|
||||
.bg
|
||||
z-index 5
|
||||
position absolute
|
||||
top 0
|
||||
left 0
|
||||
width 100%
|
||||
height 100%
|
||||
background rgba(255, 255, 255, 0.8)
|
||||
|
||||
.content
|
||||
z-index 999
|
||||
display flex
|
||||
flex-direction column
|
||||
justify-content center
|
||||
align-items center
|
||||
width 100%
|
||||
color #8a8a8a
|
||||
user-select none
|
||||
</style>
|
||||
25
src/main.styl
Normal file
25
src/main.styl
Normal file
@ -0,0 +1,25 @@
|
||||
body
|
||||
margin 0
|
||||
|
||||
img
|
||||
-webkit-user-drag none
|
||||
user-drag none
|
||||
|
||||
::-webkit-scrollbar
|
||||
width 7px
|
||||
height 7px
|
||||
|
||||
::-webkit-scrollbar-track
|
||||
background #c6c6c6
|
||||
margin 20px 0
|
||||
|
||||
::-webkit-scrollbar-thumb
|
||||
background #545454
|
||||
|
||||
#app
|
||||
overflow hidden
|
||||
width 100vw
|
||||
height 100vh
|
||||
display flex
|
||||
justify-content center
|
||||
align-items center
|
||||
6
src/main.ts
Normal file
6
src/main.ts
Normal file
@ -0,0 +1,6 @@
|
||||
import './main.styl'
|
||||
|
||||
import { createApp } from 'vue'
|
||||
import App from './App.vue'
|
||||
|
||||
createApp(App).mount('#app')
|
||||
12
tsconfig.app.json
Normal file
12
tsconfig.app.json
Normal file
@ -0,0 +1,12 @@
|
||||
{
|
||||
"extends": "@vue/tsconfig/tsconfig.dom.json",
|
||||
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
|
||||
"exclude": ["src/**/__tests__/*"],
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
}
|
||||
}
|
||||
11
tsconfig.json
Normal file
11
tsconfig.json
Normal file
@ -0,0 +1,11 @@
|
||||
{
|
||||
"files": [],
|
||||
"references": [
|
||||
{
|
||||
"path": "./tsconfig.node.json"
|
||||
},
|
||||
{
|
||||
"path": "./tsconfig.app.json"
|
||||
}
|
||||
]
|
||||
}
|
||||
16
tsconfig.node.json
Normal file
16
tsconfig.node.json
Normal file
@ -0,0 +1,16 @@
|
||||
{
|
||||
"extends": "@tsconfig/node18/tsconfig.json",
|
||||
"include": [
|
||||
"vite.config.*",
|
||||
"vitest.config.*",
|
||||
"cypress.config.*",
|
||||
"nightwatch.conf.*",
|
||||
"playwright.config.*"
|
||||
],
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "Bundler",
|
||||
"types": ["node"]
|
||||
}
|
||||
}
|
||||
25
vite.config.ts
Normal file
25
vite.config.ts
Normal file
@ -0,0 +1,25 @@
|
||||
import { fileURLToPath, URL } from 'node:url'
|
||||
|
||||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import vueJsx from '@vitejs/plugin-vue-jsx'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
define: {
|
||||
BUILD_TIME: Date.now()
|
||||
},
|
||||
plugins: [
|
||||
vue({
|
||||
script: {
|
||||
defineModel: true
|
||||
}
|
||||
}),
|
||||
vueJsx()
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||
}
|
||||
}
|
||||
})
|
||||
Loading…
Reference in New Issue
Block a user