feat: upgrade nextjs and add dockerfile

.nx-container/fe-news/digest

+sha256:dd6d3f78cc2999b5f63024254a368320c59c86ed6d4d71677ad0625f3284c707
\ No newline at end of file

.nx-container/fe-news/imageid

+sha256:dd6d3f78cc2999b5f63024254a368320c59c86ed6d4d71677ad0625f3284c707
\ No newline at end of file

.nx-container/fe-news/metadata

+{
+  "containerimage.buildinfo": {
+    "frontend": "dockerfile.v0",
+    "attrs": {
+      "filename": "Dockerfile",
+      "label:org.opencontainers.image.created": "2023-05-31T13:36:19.248Z",
+      "label:org.opencontainers.image.description": "",
+      "label:org.opencontainers.image.licenses": "",
+      "label:org.opencontainers.image.revision": "108b2806d81dfcd8eb8d53229fbd32b361276f4b",
+      "label:org.opencontainers.image.source": "",
+      "label:org.opencontainers.image.title": "",
+      "label:org.opencontainers.image.url": "",
+      "label:org.opencontainers.image.version": "main"
+    },
+    "sources": [
+      {
+        "type": "docker-image",
+        "ref": "docker.io/library/node:18-alpine",
+        "pin": "sha256:1ccc70acda680aa4ba47f53e7c40b2d4d6892de74817128e0662d32647dd7f4d"
+      }
+    ]
+  },
+  "containerimage.config.digest": "sha256:dd6d3f78cc2999b5f63024254a368320c59c86ed6d4d71677ad0625f3284c707",
+  "containerimage.digest": "sha256:dd6d3f78cc2999b5f63024254a368320c59c86ed6d4d71677ad0625f3284c707"
+}
\ No newline at end of file

apps/fe-news/.env

+__NEXT_PRIVATE_PREBUNDLED_REACT='next'
\ No newline at end of file

apps/fe-news/Dockerfile

+# Install dependencies only when needed
+FROM docker.io/node:18-alpine 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 /usr/src/app
+COPY dist/apps/fe-news/package*.json ./
+RUN npm install --only=production
+
+# Production image, copy all the files and run next
+FROM docker.io/node:18-alpine as runner
+RUN apk add --no-cache dumb-init
+ENV NODE_ENV production
+ENV PORT 3000
+WORKDIR /usr/src/app
+COPY --from=deps /usr/src/app/node_modules ./node_modules
+COPY --from=deps /usr/src/app/package.json ./package.json
+COPY dist/apps/fe-news/public ./public
+COPY dist/apps/fe-news/.next ./.next
+RUN chown -R node:node .
+USER node
+EXPOSE 3000
+# COPY --chown=node:node ./tools/scripts/entrypoints/api.sh /usr/local/bin/docker-entrypoint.sh
+# ENTRYPOINT [ "docker-entrypoint.sh" ]
+# Next.js collects completely anonymous telemetry data about general usage.
+# Learn more here: https://nextjs.org/telemetry
+# Uncomment the following line in case you want to disable telemetry.
+ENV NEXT_TELEMETRY_DISABLED 1
+CMD ["dumb-init", "node_modules/.bin/next", "start"]

apps/fe-news/next.config.js

-//@ts-check
-
 // eslint-disable-next-line @typescript-eslint/no-var-requires
 const { composePlugins, withNx } = require('@nx/next');
 const withLinaria = require('next-with-linaria');
@@ -21,9 +19,6 @@ const nextConfig = {
       },
     ],
   },
-  experimental: {
-    appDir: true,
-  },
 };
 
 const plugins = [withNx, withLinaria];

apps/fe-news/project.json

@@ -26,7 +26,7 @@
         "production": {}
       }
     },
-    "start": {
+    "serve": {
       "executor": "@nx/next:server",
       "defaultConfiguration": "development",
       "options": {
@@ -46,25 +46,6 @@
         }
       }
     },
-    "serve": {
-      "executor": "@nx/next:server",
-      "defaultConfiguration": "development",
-      "options": {
-        "buildTarget": "fe-news:build",
-        "dev": true,
-        "port": 3000
-      },
-      "configurations": {
-        "development": {
-          "buildTarget": "fe-news:build:development",
-          "dev": true
-        },
-        "production": {
-          "buildTarget": "fe-news:build:production",
-          "dev": false
-        }
-      }
-    },
     "export": {
       "executor": "@nx/next:export",
       "options": {
@@ -91,6 +72,23 @@
       "options": {
         "lintFilePatterns": ["apps/fe-news/**/*.{ts,tsx,js,jsx}"]
       }
+    },
+    "container": {
+      "executor": "@nx-tools/nx-container:build",
+      "options": {
+        "engine": "docker",
+        "metadata": {
+          "images": ["fe-cnyes/fe-news"],
+          "load": true,
+          "tags": [
+            "type=schedule",
+            "type=ref,event=branch",
+            "type=ref,event=tag",
+            "type=ref,event=pr",
+            "type=sha,prefix=sha-"
+          ]
+        }
+      }
     }
   },
   "tags": []

apps/fe-news/tsconfig.json

@@ -28,7 +28,8 @@
     "**/*.jsx",
     "next-env.d.ts",
     "../../apps/fe-news-sc/.next/types/**/*.ts",
-    "../../apps/fe-news/.next/types/**/*.ts"
+    "../../apps/fe-news/.next/types/**/*.ts",
+    "../../dist/apps/fe-news/.next/types/**/*.ts"
   ],
   "exclude": [
     "node_modules",

libs/fe-common-ui/src/lib/footer/config.ts

+/* eslint-disable @typescript-eslint/no-explicit-any */
 const footerLinks = {
   mobileNavs: [
     {
@@ -13,7 +14,7 @@ const footerLinks = {
     {
       title: '意見與回饋',
       name: 'feedback',
-      onClick: (e) => {
+      onClick: (e: any) => {
         e.preventDefault();
 
         if (typeof window !== 'undefined') {

libs/fe-common-utils/project.json

@@ -8,7 +8,7 @@
       "executor": "@nx/js:tsc",
       "outputs": ["{options.outputPath}"],
       "options": {
-        "outputPath": "libs/fe-common-utils/dist",
+        "outputPath": "dist/libs/fe-common-utils",
         "main": "libs/fe-common-utils/src/index.ts",
         "tsConfig": "libs/fe-common-utils/tsconfig.lib.json",
         "assets": ["libs/fe-common-utils/*.md"]

package.json

@@ -13,7 +13,7 @@
     "classnames": "^2.3.2",
     "isomorphic-dompurify": "^1.4.0",
     "lodash.unescape": "^4.0.1",
-    "next": "13.3.0",
+    "next": "13.4.1",
     "next-with-linaria": "^0.5.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
@@ -28,6 +28,8 @@
     "@babel/preset-react": "^7.18.6",
     "@babel/preset-typescript": "^7.21.5",
     "@linaria/vite": "^4.2.10",
+    "@nx-tools/container-metadata": "^4.0.3",
+    "@nx-tools/nx-container": "^4.0.3",
     "@nx/cypress": "16.0.3",
     "@nx/eslint-plugin": "16.0.3",
     "@nx/jest": "16.0.3",