From d0073ac492bc22de17c2f853cb46d31ac4b65793 Mon Sep 17 00:00:00 2001 From: Chuck Dries Date: Sat, 24 Jul 2021 14:45:38 -0700 Subject: [PATCH] install prettier --- .prettierignore | 4 ++++ .prettierrc.json | 1 + package.json | 4 +++- postcss.config.js | 2 +- src/App.css | 53 ---------------------------------------------- src/App.tsx | 28 ++++++++++++------------ src/main.tsx | 12 +++++------ tailwind.config.js | 12 +++++++---- vite.config.ts | 8 +++---- yarn.lock | 5 +++++ 10 files changed, 46 insertions(+), 83 deletions(-) create mode 100644 .prettierignore create mode 100644 .prettierrc.json diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 0000000..40cd782 --- /dev/null +++ b/.prettierignore @@ -0,0 +1,4 @@ +node_modules +dist +dist-ssr +*.local diff --git a/.prettierrc.json b/.prettierrc.json new file mode 100644 index 0000000..0967ef4 --- /dev/null +++ b/.prettierrc.json @@ -0,0 +1 @@ +{} diff --git a/package.json b/package.json index 099778f..7cadd4f 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,8 @@ "scripts": { "dev": "vite", "build": "tsc && vite build", - "serve": "vite preview" + "serve": "vite preview", + "format": "prettier --write ." }, "dependencies": { "react": "^17.0.0", @@ -16,6 +17,7 @@ "@vitejs/plugin-react-refresh": "^1.3.1", "autoprefixer": "^10.3.1", "postcss": "^8.3.6", + "prettier": "2.3.2", "tailwindcss": "^2.2.7", "typescript": "^4.3.2", "vite": "^2.4.3" diff --git a/postcss.config.js b/postcss.config.js index 33ad091..12a703d 100644 --- a/postcss.config.js +++ b/postcss.config.js @@ -3,4 +3,4 @@ module.exports = { tailwindcss: {}, autoprefixer: {}, }, -} +}; diff --git a/src/App.css b/src/App.css index 18fc57c..e69de29 100644 --- a/src/App.css +++ b/src/App.css @@ -1,53 +0,0 @@ -.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-logo.spin-reverse { - animation: App-logo-spin-reverse 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); - } -} -@keyframes App-logo-spin-reverse { - from { - transform: rotate(0deg); - } - to { - transform: rotate(-360deg); - } -} - -button { - font-size: calc(10px + 2vmin); -} diff --git a/src/App.tsx b/src/App.tsx index 4d2fae8..69cdb38 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -17,7 +17,7 @@ const Greeter: React.FC = ({ name, setName }) => { autoFocus type="text" style={{ - width: Math.max(100, 14 * name.length) + "px", + width: Math.max(100, 10 * name.length) + "px", }} value={name} onChange={(e) => setName(e.target.value)} @@ -30,20 +30,20 @@ function App() { const [count, setCount] = useState(0); const [name, setName] = useState(""); return ( -
-
- logo -

Hello Vite + React!

+
+ logo +
+

Hello Vite + React!

-
+
); } diff --git a/src/main.tsx b/src/main.tsx index 606a3cf..846ed2c 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -1,11 +1,11 @@ -import React from 'react' -import ReactDOM from 'react-dom' -import './index.css' -import App from './App' +import React from "react"; +import ReactDOM from "react-dom"; +import "./index.css"; +import App from "./App"; ReactDOM.render( , - document.getElementById('root') -) + document.getElementById("root") +); diff --git a/tailwind.config.js b/tailwind.config.js index 36a447d..cd91004 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -1,12 +1,16 @@ module.exports = { - mode: 'jit', - purge: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'], + mode: "jit", + purge: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"], darkMode: false, // or 'media' or 'class' theme: { - extend: {}, + extend: { + colors: { + "regal-blue": "#243c5a", + }, + }, }, variants: { extend: {}, }, plugins: [], -} +}; diff --git a/vite.config.ts b/vite.config.ts index 5e7342c..8479398 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,7 +1,7 @@ -import { defineConfig } from 'vite' -import reactRefresh from '@vitejs/plugin-react-refresh' +import { defineConfig } from "vite"; +import reactRefresh from "@vitejs/plugin-react-refresh"; // https://vitejs.dev/config/ export default defineConfig({ - plugins: [reactRefresh()] -}) + plugins: [reactRefresh()], +}); diff --git a/yarn.lock b/yarn.lock index 52a311c..4d4edf3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1011,6 +1011,11 @@ postcss@^8.1.6, postcss@^8.2.1, postcss@^8.3.5, postcss@^8.3.6: nanoid "^3.1.23" source-map-js "^0.6.2" +prettier@2.3.2: + version "2.3.2" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.3.2.tgz#ef280a05ec253712e486233db5c6f23441e7342d" + integrity sha512-lnJzDfJ66zkMy58OL5/NY5zp70S7Nz6KqcKkXYzn2tMVrNxvbqaBpg7H3qHaLxCJ5lNMsGuM8+ohS7cZrthdLQ== + pretty-hrtime@^1.0.3: version "1.0.3" resolved "https://registry.yarnpkg.com/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz#b7e3ea42435a4c9b2759d99e0f201eb195802ee1"