From 017fc69661464b9d151da90845fc22a26b83191e Mon Sep 17 00:00:00 2001 From: syy11cn Date: Fri, 29 Oct 2021 14:52:55 +0800 Subject: [PATCH] init react-vite project using vite@latest --- .gitignore | 5 +++++ .vscode/settings.json | 6 ++++++ index.html | 13 +++++++++++++ package.json | 17 ++++++++++++++++ src/App.css | 42 ++++++++++++++++++++++++++++++++++++++++ src/App.jsx | 45 +++++++++++++++++++++++++++++++++++++++++++ src/favicon.svg | 15 +++++++++++++++ src/index.css | 13 +++++++++++++ src/logo.svg | 7 +++++++ src/main.jsx | 11 +++++++++++ vite.config.js | 7 +++++++ 11 files changed, 181 insertions(+) create mode 100644 .gitignore create mode 100644 .vscode/settings.json create mode 100644 index.html create mode 100644 package.json create mode 100644 src/App.css create mode 100644 src/App.jsx create mode 100644 src/favicon.svg create mode 100644 src/index.css create mode 100644 src/logo.svg create mode 100644 src/main.jsx create mode 100644 vite.config.js diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..53f7466 --- /dev/null +++ b/.gitignore @@ -0,0 +1,5 @@ +node_modules +.DS_Store +dist +dist-ssr +*.local \ No newline at end of file diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..0605329 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,6 @@ +{ + "files.associations": { + "*.ttss": "css", + "*.ttml": "xml" + } +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..b46ab83 --- /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..00a4eef --- /dev/null +++ b/package.json @@ -0,0 +1,17 @@ +{ + "name": "react-vite-template", + "version": "0.0.0", + "scripts": { + "dev": "vite", + "build": "vite build", + "serve": "vite preview" + }, + "dependencies": { + "react": "^17.0.0", + "react-dom": "^17.0.0" + }, + "devDependencies": { + "@vitejs/plugin-react": "^1.0.0", + "vite": "^2.6.4" + } +} \ 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.jsx b/src/App.jsx new file mode 100644 index 0000000..7d4eb10 --- /dev/null +++ b/src/App.jsx @@ -0,0 +1,45 @@ +import { 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.jsx 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..ec2585e --- /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.jsx b/src/main.jsx new file mode 100644 index 0000000..606a3cf --- /dev/null +++ b/src/main.jsx @@ -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/vite.config.js b/vite.config.js new file mode 100644 index 0000000..b1b5f91 --- /dev/null +++ b/vite.config.js @@ -0,0 +1,7 @@ +import { defineConfig } from 'vite' +import react from '@vitejs/plugin-react' + +// https://vitejs.dev/config/ +export default defineConfig({ + plugins: [react()] +})