From d4f4d51f6cb708587896a7f6d66621681c300bfe Mon Sep 17 00:00:00 2001 From: Ivan Li Date: Sun, 11 Apr 2021 13:34:59 +0800 Subject: [PATCH] init project --- .gitignore | 5 +++++ index.html | 13 +++++++++++++ package.json | 20 ++++++++++++++++++++ src/App.css | 42 ++++++++++++++++++++++++++++++++++++++++++ src/App.tsx | 45 +++++++++++++++++++++++++++++++++++++++++++++ src/favicon.svg | 15 +++++++++++++++ src/index.css | 13 +++++++++++++ src/logo.svg | 7 +++++++ src/main.tsx | 11 +++++++++++ tsconfig.json | 20 ++++++++++++++++++++ vite.config.ts | 7 +++++++ 11 files changed, 198 insertions(+) create mode 100644 .gitignore create mode 100644 index.html create mode 100644 package.json create mode 100644 src/App.css create mode 100644 src/App.tsx create mode 100644 src/favicon.svg create mode 100644 src/index.css create mode 100644 src/logo.svg create mode 100644 src/main.tsx create mode 100644 tsconfig.json create mode 100644 vite.config.ts diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..d451ff1 --- /dev/null +++ b/.gitignore @@ -0,0 +1,5 @@ +node_modules +.DS_Store +dist +dist-ssr +*.local diff --git a/index.html b/index.html new file mode 100644 index 0000000..b755334 --- /dev/null +++ b/index.html @@ -0,0 +1,13 @@ + + + + + + + Vite App + + +
+ + + diff --git a/package.json b/package.json new file mode 100644 index 0000000..a7864c3 --- /dev/null +++ b/package.json @@ -0,0 +1,20 @@ +{ + "name": "blog", + "version": "0.0.0", + "scripts": { + "dev": "vite", + "build": "tsc && vite build", + "serve": "vite preview" + }, + "dependencies": { + "react": "^17.0.0", + "react-dom": "^17.0.0" + }, + "devDependencies": { + "@types/react": "^17.0.0", + "@types/react-dom": "^17.0.0", + "@vitejs/plugin-react-refresh": "^1.3.1", + "typescript": "^4.1.2", + "vite": "^2.1.5" + } +} \ No newline at end of file diff --git a/src/App.css b/src/App.css new file mode 100644 index 0000000..8da3fde --- /dev/null +++ b/src/App.css @@ -0,0 +1,42 @@ +.App { + text-align: center; +} + +.App-logo { + height: 40vmin; + pointer-events: none; +} + +@media (prefers-reduced-motion: no-preference) { + .App-logo { + animation: App-logo-spin infinite 20s linear; + } +} + +.App-header { + background-color: #282c34; + min-height: 100vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + font-size: calc(10px + 2vmin); + color: white; +} + +.App-link { + color: #61dafb; +} + +@keyframes App-logo-spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} + +button { + font-size: calc(10px + 2vmin); +} diff --git a/src/App.tsx b/src/App.tsx new file mode 100644 index 0000000..f6b94f6 --- /dev/null +++ b/src/App.tsx @@ -0,0 +1,45 @@ +import React, { useState } from 'react' +import logo from './logo.svg' +import './App.css' + +function App() { + const [count, setCount] = useState(0) + + return ( +
+
+ logo +

Hello Vite + React!

+

+ +

+

+ Edit App.tsx and save to test HMR updates. +

+

+ + Learn React + + {' | '} + + Vite Docs + +

+
+
+ ) +} + +export default App diff --git a/src/favicon.svg b/src/favicon.svg new file mode 100644 index 0000000..de4aedd --- /dev/null +++ b/src/favicon.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/src/index.css b/src/index.css new file mode 100644 index 0000000..4a1df4d --- /dev/null +++ b/src/index.css @@ -0,0 +1,13 @@ +body { + margin: 0; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", + "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", + sans-serif; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +code { + font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", + monospace; +} diff --git a/src/logo.svg b/src/logo.svg new file mode 100644 index 0000000..6b60c10 --- /dev/null +++ b/src/logo.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/src/main.tsx b/src/main.tsx new file mode 100644 index 0000000..606a3cf --- /dev/null +++ b/src/main.tsx @@ -0,0 +1,11 @@ +import React from 'react' +import ReactDOM from 'react-dom' +import './index.css' +import App from './App' + +ReactDOM.render( + + + , + document.getElementById('root') +) diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..51efd41 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,20 @@ +{ + "compilerOptions": { + "target": "ESNext", + "lib": ["DOM", "DOM.Iterable", "ESNext"], + "types": ["vite/client"], + "allowJs": false, + "skipLibCheck": false, + "esModuleInterop": false, + "allowSyntheticDefaultImports": true, + "strict": true, + "forceConsistentCasingInFileNames": true, + "module": "ESNext", + "moduleResolution": "Node", + "resolveJsonModule": true, + "isolatedModules": true, + "noEmit": true, + "jsx": "react" + }, + "include": ["./src"] +} diff --git a/vite.config.ts b/vite.config.ts new file mode 100644 index 0000000..5e7342c --- /dev/null +++ b/vite.config.ts @@ -0,0 +1,7 @@ +import { defineConfig } from 'vite' +import reactRefresh from '@vitejs/plugin-react-refresh' + +// https://vitejs.dev/config/ +export default defineConfig({ + plugins: [reactRefresh()] +})