Upon completing the development and deployment of a Next.js website, I observed that the black compile indicator continued to appear in the bottom-right corner of my browser, similar to its presence during local development.
The indicator can be viewed here: https://i.sstatic.net/FVWEU.gif
According to Next.js's official documentation:
This indicator is specifically visible in development mode and should not be displayed when the app is built and executed in production mode.
Even when running yarn build and yarn start locally, the indicator persists while the page loads.
Throughout the build process, the terminal output indicates:
Creating an optimized production build Done in 20.89s.
My primary concern isn't solely about the display of the indicator, as it can be disabled. What worries me is whether the build is truly optimized since something intended for development mode is visible in a production setting.
Please note that I am unable to share a direct link to the website due to confidentiality reasons related to work.
Has anyone encountered a similar issue before?
Thank you for your assistance!
Technical details:
Next.js Version 12.1.1
Dockerfile:
FROM node:16.13.0-alpine
# Install packages.
WORKDIR /app
COPY package.json .
COPY yarn.lock .
RUN yarn install
# Copy all other files.
COPY . .
# Build the app.
RUN yarn build
# USER node
EXPOSE 3003
CMD ["yarn", "start"]
package.json (scripts block):
"scripts": {
"dev": "node ssr-server.js",
"build": "next build",
"test": "node_modules/.bin/jest",
"test:coverage": "node_modules/.bin/jest --coverage",
"test:watch": "node_modules/.bin/jest --watch",
"start": "node ssr-server.js"
},