update next.config.js

gihyo-book · Jun 19, 2022 · 4f31e9d · 4f31e9d
1 parent 771968c
commit 4f31e9d
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 7 deletions.
diff --git a/next.config.js b/next.config.js
@@ -1,12 +1,22 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
-  compiler: {
-    // styledComponentsの有効化
-    styledComponents: true,
-    // React Testing Libraryで使用するdata-testid属性を削除
-    reactRemoveProperties: { properties: ['^data-testid$'] },
-  },
+  compiler: (() => {
+    let compilerConfig = {
+      // styledComponentsの有効化
+      styledComponents: true,
+    }
+
+    if (process.env.NODE_ENV === 'production') {
+      compilerConfig = {
+        ...compilerConfig,
+        // 本番環境ではReact Testing Libraryで使用するdata-testid属性を削除
+        reactRemoveProperties: { properties: ['^data-testid$'] },
+      }
+    }
+
+    return compilerConfig
+  })(),
   async rewrites() {
     return [
       {

diff --git a/src/utils/styles.ts b/src/utils/styles.ts
@@ -95,28 +95,37 @@ function toThemeValueIfNeeded<T>(propKey: string, value: T, theme?: AppTheme) {
   const lineSpacingKeys = new Set(['letter-spacing'])
   const lineHeightKeys = new Set(['line-height'])
 
-  if (theme && spaceKeys.has(propKey) && isSpaceThemeKeys(value, theme)) {
+  if (
+    theme &&
+    theme.space &&
+    spaceKeys.has(propKey) &&
+    isSpaceThemeKeys(value, theme)
+  ) {
     return theme.space[value]
   } else if (
     theme &&
+    theme.colors &&
     colorKeys.has(propKey) &&
     isColorThemeKeys(value, theme)
   ) {
     return theme.colors[value]
   } else if (
     theme &&
+    theme.fontSizes &&
     fontSizeKeys.has(propKey) &&
     isFontSizeThemeKeys(value, theme)
   ) {
     return theme.fontSizes[value]
   } else if (
     theme &&
+    theme.letterSpacings &&
     lineSpacingKeys.has(propKey) &&
     isLetterSpacingThemeKeys(value, theme)
   ) {
     return theme.letterSpacings[value]
   } else if (
     theme &&
+    theme.lineHeights &&
     lineHeightKeys.has(propKey) &&
     isLineHeightThemeKeys(value, theme)
   ) {