- 쉼쉼 프로젝트 초기 셋팅
+
+
쉼쉼 초기셋팅 use Vite Bundler
);
}
diff --git a/src/assets/images/circle.hover.svg b/src/assets/images/circle.hover.svg
new file mode 100644
index 0000000..5144816
--- /dev/null
+++ b/src/assets/images/circle.hover.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/assets/images/circle.svg b/src/assets/images/circle.svg
new file mode 100644
index 0000000..8cf76ac
--- /dev/null
+++ b/src/assets/images/circle.svg
@@ -0,0 +1,2 @@
+
+
diff --git a/src/assets/images/favicon.svg b/src/assets/images/favicon.svg
new file mode 100644
index 0000000..de4aedd
--- /dev/null
+++ b/src/assets/images/favicon.svg
@@ -0,0 +1,15 @@
+
diff --git a/src/index.tsx b/src/index.tsx
deleted file mode 100644
index 7998135..0000000
--- a/src/index.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import App from './App';
-import reportWebVitals from './reportWebVitals';
-
-ReactDOM.render(
-
-
- ,
- document.getElementById('root')
-);
-
-// If you want to start measuring performance in your app, pass a function
-// to log results (for example: reportWebVitals(console.log))
-// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
-reportWebVitals();
diff --git a/src/main.css b/src/main.css
new file mode 100644
index 0000000..8631bb5
--- /dev/null
+++ b/src/main.css
@@ -0,0 +1,7 @@
+html {
+ cursor: url('./assets/images/circle.svg'), auto;
+}
+
+.object {
+ cursor: url('./assets/images/circle.hover.svg'), auto;
+}
diff --git a/src/main.tsx b/src/main.tsx
new file mode 100644
index 0000000..8013527
--- /dev/null
+++ b/src/main.tsx
@@ -0,0 +1,12 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import './reset.css';
+import './main.css';
+import App from './App';
+
+ReactDOM.render(
+
+
+ ,
+ document.getElementById('root'),
+);
diff --git a/src/react-app-env.d.ts b/src/react-app-env.d.ts
deleted file mode 100644
index 6431bc5..0000000
--- a/src/react-app-env.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-///
diff --git a/src/reportWebVitals.ts b/src/reportWebVitals.ts
deleted file mode 100644
index 49a2a16..0000000
--- a/src/reportWebVitals.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { ReportHandler } from 'web-vitals';
-
-const reportWebVitals = (onPerfEntry?: ReportHandler) => {
- if (onPerfEntry && onPerfEntry instanceof Function) {
- import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
- getCLS(onPerfEntry);
- getFID(onPerfEntry);
- getFCP(onPerfEntry);
- getLCP(onPerfEntry);
- getTTFB(onPerfEntry);
- });
- }
-};
-
-export default reportWebVitals;
diff --git a/src/reset.css b/src/reset.css
new file mode 100644
index 0000000..a3f7681
--- /dev/null
+++ b/src/reset.css
@@ -0,0 +1,129 @@
+/* http://meyerweb.com/eric/tools/css/reset/
+ v2.0 | 20110126
+ License: none (public domain)
+*/
+
+html,
+body,
+div,
+span,
+applet,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+a,
+abbr,
+acronym,
+address,
+big,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+s,
+samp,
+small,
+strike,
+strong,
+sub,
+sup,
+tt,
+var,
+b,
+u,
+i,
+center,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+canvas,
+details,
+embed,
+figure,
+figcaption,
+footer,
+header,
+hgroup,
+menu,
+nav,
+output,
+ruby,
+section,
+summary,
+time,
+mark,
+audio,
+video {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ font-size: 100%;
+ font: inherit;
+ vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+ display: block;
+}
+body {
+ line-height: 1;
+}
+ol,
+ul {
+ list-style: none;
+}
+blockquote,
+q {
+ quotes: none;
+}
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+ content: '';
+ content: none;
+}
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
diff --git a/src/setupTests.ts b/src/setupTests.ts
deleted file mode 100644
index 8f2609b..0000000
--- a/src/setupTests.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-// jest-dom adds custom jest matchers for asserting on DOM nodes.
-// allows you to do things like:
-// expect(element).toHaveTextContent(/react/i)
-// learn more: https://github.com/testing-library/jest-dom
-import '@testing-library/jest-dom';
diff --git a/src/style.css.ts b/src/style.css.ts
new file mode 100644
index 0000000..cff86eb
--- /dev/null
+++ b/src/style.css.ts
@@ -0,0 +1,19 @@
+import { createTheme, style } from '@vanilla-extract/css';
+
+// theme 생성
+export const [themeClass, vars] = createTheme({
+ color: {
+ primary: 'pink',
+ text: 'white',
+ },
+ font: {
+ body: 'arial',
+ },
+});
+
+// style 생성
+export const appStyle = style({
+ background: vars.color.primary,
+ color: vars.color.text,
+ height: '10vh',
+});
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
new file mode 100644
index 0000000..11f02fe
--- /dev/null
+++ b/src/vite-env.d.ts
@@ -0,0 +1 @@
+///
diff --git a/tsconfig.json b/tsconfig.json
index a273b0c..c8bdc64 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,26 +1,21 @@
{
"compilerOptions": {
- "target": "es5",
- "lib": [
- "dom",
- "dom.iterable",
- "esnext"
- ],
- "allowJs": true,
- "skipLibCheck": true,
- "esModuleInterop": true,
+ "target": "ESNext",
+ "useDefineForClassFields": true,
+ "lib": ["DOM", "DOM.Iterable", "ESNext"],
+ "allowJs": false,
+ "skipLibCheck": false,
+ "esModuleInterop": false,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
- "noFallthroughCasesInSwitch": true,
- "module": "esnext",
- "moduleResolution": "node",
+ "module": "ESNext",
+ "moduleResolution": "Node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx"
},
- "include": [
- "src"
- ]
+ "include": ["src"],
+ "references": [{ "path": "./tsconfig.node.json" }]
}
diff --git a/tsconfig.node.json b/tsconfig.node.json
new file mode 100644
index 0000000..e993792
--- /dev/null
+++ b/tsconfig.node.json
@@ -0,0 +1,8 @@
+{
+ "compilerOptions": {
+ "composite": true,
+ "module": "esnext",
+ "moduleResolution": "node"
+ },
+ "include": ["vite.config.ts"]
+}
diff --git a/vite.config.ts b/vite.config.ts
new file mode 100644
index 0000000..b06acac
--- /dev/null
+++ b/vite.config.ts
@@ -0,0 +1,7 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+import { vanillaExtractPlugin } from '@vanilla-extract/vite-plugin';
+// https://vitejs.dev/config/
+export default defineConfig({
+ plugins: [react(),vanillaExtractPlugin()]
+})