Merge pull request #4 from f-lab-edu/feature/3-style-library-setting

환경설정 - Vanilla Extract 설정 추가

apps/web/next.config.js

@@ -0,0 +1,17 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+
+const { createVanillaExtractPlugin } = require("@vanilla-extract/next-plugin");
+const { PHASE_DEVELOPMENT_SERVER } = require("next/constants");
+
+/** @type {import('next').NextConfig} */
+module.exports = (phase) => {
+  const withVanillaExtract = createVanillaExtractPlugin({
+    identifiers: phase === PHASE_DEVELOPMENT_SERVER ? "debug" : "short",
+  });
+
+  const nextConfig = {
+    reactStrictMode: true,
+  };
+
+  return withVanillaExtract(nextConfig);
+};

apps/web/package.json

@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "next dev --turbo",
+    "dev": "next dev",
     "build": "next build",
     "start": "next start",
     "lint": "next lint"
@@ -19,6 +19,12 @@
     "@types/node": "^20",
     "@types/react": "^18",
     "@types/react-dom": "^18",
+    "@vanilla-extract/css": "^1.15.3",
+    "@vanilla-extract/css-utils": "^0.1.4",
+    "@vanilla-extract/dynamic": "^2.1.1",
+    "@vanilla-extract/next-plugin": "^2.4.3",
+    "@vanilla-extract/recipes": "^0.5.3",
+    "@vanilla-extract/sprinkles": "^1.6.2",
     "eslint": "^8",
     "eslint-config-next": "14.2.5",
     "typescript": "^5"

apps/web/tsconfig.json

@@ -12,7 +12,7 @@
   },
   "include": [
     "next-env.d.ts",
-    "next.config.mjs",
+    "next.config.js",
     "lint-staged.config.cjs",
     "**/*.ts",
     "**/*.tsx",