Merge branch 'main' of https://github.com/tangly1024/NotionNext

.env.example

@@ -173,3 +173,4 @@
 # ENABLE_CACHE=
 # VERCEL_ENV=
 # NEXT_PUBLIC_VERSION=
+# NEXT_BUILD_STANDALONE=

Dockerfile

@@ -1,23 +1,42 @@
 ARG NOTION_PAGE_ID
 ARG NEXT_PUBLIC_THEME
 
-# Install dependencies only when needed
-FROM node:18-alpine3.18 AS deps
+FROM node:18-alpine3.18 AS base
+
+# 1. Install dependencies only when needed
+FROM base AS deps
 # Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
 RUN apk add --no-cache libc6-compat
 WORKDIR /app
 COPY package.json ./
 RUN yarn install --frozen-lockfile
 
-# Rebuild the source code only when needed
-FROM node:18-alpine3.18 AS builder
+# 2. Rebuild the source code only when needed
+FROM base AS builder
 ARG NOTION_PAGE_ID
+ENV NEXT_BUILD_STANDALONE=true
+
 WORKDIR /app
+
 COPY --from=deps /app/node_modules ./node_modules
 COPY . .
 RUN yarn build
 
-ENV NODE_ENV production
+# 3. Production image, copy all the files and run next
+FROM base AS runner
+ENV NODE_ENV=production
+
+WORKDIR /app
+
+COPY --from=builder /app/public ./public
+
+# Automatically leverage output traces to reduce image size
+# https://nextjs.org/docs/advanced-features/output-file-tracing
+COPY --from=builder /app/.next/standalone ./
+COPY --from=builder /app/.next/static ./.next/static
+
+# 个人仓库把将配置好的.env.local文件放到项目根目录，可自动使用环境变量
+# COPY --from=builder /app/.env.local ./
 
 EXPOSE 3000
 
@@ -26,4 +45,4 @@ EXPOSE 3000
 # Uncomment the following line in case you want to disable telemetry.
 # ENV NEXT_TELEMETRY_DISABLED 1
 
-CMD ["yarn", "start"]
+CMD ["node", "server.js"]

next.config.js

@@ -84,7 +84,7 @@ const nextConfig = {
   eslint: {
     ignoreDuringBuilds: true
   },
-  output: process.env.EXPORT ? 'export' : undefined,
+  output: process.env.EXPORT ? 'export' : process.env.NEXT_BUILD_STANDALONE === 'true' ? 'standalone' : undefined,
   staticPageGenerationTimeout: 120,
   // 多语言， 在export时禁用
   i18n: process.env.EXPORT

themes/starter/components/MenuItem.js

@@ -42,7 +42,7 @@ export const MenuItem = ({ link }) => {
         <li className='submenu-item group relative whitespace-nowrap'>
           <button
             onClick={toggleSubMenu}
-            className={`cursor-pointer relative w-full px-8 flex items-center justify-between py-2 text-base font-medium text-dark group-hover:text-primary dark:text-white lg:ml-8 lg:mr-0 lg:inline-flex lg:py-6 lg:pl-0 lg:pr-4 ${
+            className={`cursor-pointer relative px-8 flex items-center justify-between py-2 text-base font-medium text-dark group-hover:text-primary dark:text-white lg:ml-8 lg:mr-0 lg:inline-flex lg:py-6 lg:pl-0 lg:pr-4 ${
               router.route === '/'
                 ? 'lg:text-white lg:group-hover:text-white'
                 : ''

themes/starter/style.js

@@ -54,6 +54,11 @@ const Style = () => {
     color: rgb(55 88 249 / var(--tw-text-opacity));
     opacity: 1;
   }
+
+  #theme-starter .sticky #navbarCollapse li > button{
+    --tw-text-opacity: 1;
+    color: rgb(17 25 40 / var(--tw-text-opacity));
+  }
   
   :is(.dark #theme-starter .sticky #navbarCollapse li > a){
     --tw-text-opacity: 1;
@@ -64,7 +69,12 @@ const Style = () => {
     --tw-text-opacity: 1;
     color: rgb(55 88 249 / var(--tw-text-opacity));
   }
-  
+
+  :is(.dark #theme-starter .sticky #navbarCollapse li > button){
+    --tw-text-opacity: 1;
+    color: rgb(255 255 255 / var(--tw-text-opacity));
+  }
+
   #navbarCollapse li .ud-menu-scroll.active{
     opacity: 0.7;
   }