Pwa-module: FATAL ENOENT: no such file or directory, open '/usr/src/app/node_modules/.cache/pwa/icon/iphonexsmax_1242x2688.png' when building in docker

[TannerGilbert]

I'm getting FATAL ENOENT: no such file or directory, open '/usr/src/app/node_modules/.cache/pwa/icon/iphonexsmax_1242x2688.png' when building my Nuxt pwa app in Docker on a DigitalOcean droplet. The weird thing is that it only happens when I build the container on DigitalOcean an not on my local machine.

Nuxt PWA version: 3.0.2

[pi0]

Hi @TannerGilbert Would you please share nuxt.config and Dockerfile?

[XristMisyris]

Hello, I am having the same issue on a Digital Ocean droplet. On my local machine is working fine.

My nuxt.config file https://pastebin.com/ktzbASzM

P.S I am not using docker.

[TannerGilbert]

nuxt.config.js:

import getRoutes from "./utils/getRoutes";

export default {
  /*
   ** Nuxt rendering mode
   ** See https://nuxtjs.org/api/configuration-mode
   */
  mode: 'universal',
  /*
   ** Nuxt target
   ** See https://nuxtjs.org/api/configuration-target
   */
  target: 'server',
  /*
   ** Global CSS
   */
  css: ['uikit/dist/css/uikit.css'],
  /*
   ** Plugins to load before mounting the App
   ** https://nuxtjs.org/guide/plugins
   */
  plugins: [
    { src: '~/plugins/uikit', ssr: false },
    { src: '~/plugins/ga.js', mode: 'client' },
  ],
  /*
   ** Auto import components
   ** See https://nuxtjs.org/api/configuration-components
   */
  components: true,
  /*
   ** Nuxt.js dev-modules
   */
  buildModules: [],
  /*
   ** Nuxt.js modules
   */
  modules: [
    '@nuxtjs/pwa',
    // Doc: https://github.com/nuxt/content
    '@nuxt/content',
    "@nuxtjs/sitemap",
  ],
  /*
   ** Content module configuration
   ** See https://content.nuxtjs.org/configuration
   */
  content: {
    markdown: {
      prism: {
        theme: false,
      },
      remarkPlugins: ['remark-math'],
      rehypePlugins: ['rehype-mathjax'],
    },
  },
  /*
   ** Build configuration
   ** See https://nuxtjs.org/api/configuration-build/
   */
  build: {},
  sitemap: {
    hostname: <>',
    routes() {
      return getRoutes();
    },
  },

  components: true,
}

Dockerfile:

FROM node:10

WORKDIR /usr/src/app

COPY package*.json ./

RUN npm ci

COPY . .

RUN npm run build

EXPOSE 80

CMD ["npm", "start"]

[javierpomachagua]

+1 Same with droplet in DO

[maybebot]

Somebody else reported the same problem on the Discord Nuxt server on a 5$ droplet.

@TannerGilbert and the others, are you also building on the 5$ droplet?

My guess is that 1GB of ram is not enough for jimp (the image generation tool used by this module) to create the large iphonexsmax_1242x2688.png image. If jimp fails it doesn't kill the build process (jimp issue here) but later on nuxt cannot find the file.

A workaround, if I am right, would be to add some swap space to the 1GB ram droplet, and see if that helps. DO guide here. Of course upgrading to a pricier droplet would have the same result.

If somebody can test this solution, please share the results here :)

[TannerGilbert]

Yes I'm using a 5$ droplet. I'll try increasing the swap and let you know if this helps

[TannerGilbert]

@maybebot I set the swap to 1GB as described in the article you mentioned and now it seems to work fine. Thanks for the help.