Yarn Dependency Issues

—

### Key Issues:
1. **Peer Dependency Warnings**:
– `eslint` is outdated (`4.19.1` vs `^6.0.0 || ^7.2.0`).
– `node-sass` version `5.0.0` doesn't satisfy `sass-loader` requirements.
– `webpack` version `3.10.0` is too old for the dependencies that rely on it.

2. **Build Failures**:
– `node-sass@5.0.0` fails to build successfully. This often happens due to compatibility issues with the Node.js version.

3. **PostCSS Missing**:
– The project doesn't provide `postcss`, which is required by `autoprefixer` and others.

4. **Outdated Packages**:
– `core-js`, `uglifyjs-webpack-plugin`, and other dependencies may need to be updated or replaced.

—

### Steps to Resolve:

#### 1. **Check Node.js Compatibility**:
– You’re using Node.js 21, which might not be compatible with older dependencies like `node-sass`. Consider downgrading to Node.js 18 (LTS) to improve compatibility.

nvm install 18
   nvm use 18

#### 2. **Update Project Dependencies**:
– Update dependencies to meet peer requirements. Use the following commands:

yarn upgrade eslint@^6.0.0
   yarn upgrade node-sass@^7.0.0
   yarn upgrade webpack@^5.0.0
   yarn add postcss autoprefixer

Alternatively, if you want to resolve all peer issues in one go:

yarn up -R --latest

#### 3. **Use Dart Sass Instead of Node Sass**:
– `node-sass` is deprecated in favor of `sass`. Replace it by running:

yarn remove node-sass
   yarn add sass

#### 4. **Install Missing Peer Dependencies**:
– Use `yarn explain peer-requirements` to get more details about the unmet requirements and address them manually.

#### 5. **Clean and Reinstall**:
– After resolving dependency conflicts, clean your workspace and reinstall:

yarn cache clean
   rm -rf node_modules
   yarn install

#### 6. **Debug Build Failures**:
– Check the specific error logs for `node-sass` in `/tmp/xfs-437db346/build.log`. This can provide additional insights into the failure.

#### 7. **Switch to Yarn Compatibility Mode (if necessary)**:
– If some older dependencies still fail with Yarn v4, use compatibility mode:

yarn set version berry
   yarn config set nodeLinker node-modules

This simulates Yarn v1 behavior for better compatibility.

—

### After Applying Fixes:
Run `yarn install` again and check for errors. If any warnings persist, revisit the relevant dependencies to ensure all conflicts are resolved.

# Install system dependencies and PHP extensions
RUN apt-get update && apt-get install -y
zip
unzip
git
curl
libpng-dev
libjpeg-dev
libfreetype6-dev
libzip-dev
&& docker-php-ext-install pdo pdo_mysql zip gd mysqli bcmath
&& apt-get clean && rm -rf /var/lib/apt/lists/*

# Install Node.js (version 20.x)
RUN curl -fsSL https://deb.nodesource.com/setup_20.x | bash – &&
apt-get install -y nodejs &&
apt-get clean && rm -rf /var/lib/apt/lists/*

# Install Yarn 4.3.1 using Corepack
RUN corepack enable && corepack prepare yarn@4.3.1 –activate

# Verify Yarn installation
RUN yarn –version

# Copy Composer (from official Composer image)
COPY –from=composer:2.7 /usr/bin/composer /usr/bin/composer

# Copy custom php.ini
COPY php.ini /usr/local/etc/php/php.ini

# Set the working directory
WORKDIR /var/www

# Expose PHP-FPM port
EXPOSE 9000
adjust in above

—

### Adjustments:

1. **PHP Version**: PHP 7.3 is end-of-life and should ideally be upgraded to a newer version (e.g., PHP 8.1 or 8.2). If you need PHP 7.3 for legacy reasons, ensure it's explicitly supported in your project.

2. **Efficient Layering**: Combine related commands into logical steps to reduce the number of layers in the image.

3. **Node.js and Yarn**:
– You've used Node.js 20.x, which is not compatible with PHP 7.3 due to potential dependencies requiring newer PHP versions. If you're sticking to Node.js 20.x, consider upgrading PHP.
– Ensure

—

### **Optimized Node.js Installation:**

#### **1. Use Node.js Official Image as a Base:**
– Instead of manually setting up Node.js in your PHP container, you can use a multi-stage build to install Node.js. This avoids potential conflicts and ensures the PHP and Node.js environments are isolated but integrated when needed.

# Stage 1: Build assets with Node.js
FROM node:20 as node-builder

WORKDIR /app

# Install dependencies (adjust to your needs)
COPY package.json yarn.lock ./
RUN yarn install

# Build assets
COPY . .
RUN yarn build

# Stage 2: PHP with Node.js
FROM php:7.3-fpm

# Install system dependencies and PHP extensions
RUN apt-get update && apt-get install -y 
    zip 
    unzip 
    git 
    curl 
    libpng-dev 
    libjpeg-dev 
    libfreetype6-dev 
    libzip-dev 
    && docker-php-ext-install pdo pdo_mysql zip gd mysqli bcmath 
    && apt-get clean && rm -rf /var/lib/apt/lists/*

# Copy Node.js assets from the builder stage
COPY --from=node-builder /app /var/www

# Install Composer (from official Composer image)
COPY --from=composer:2.7 /usr/bin/composer /usr/bin/composer

# Set the working directory
WORKDIR /var/www

# Expose PHP-FPM port
EXPOSE 9000

—

#### **2. Stick to the Current Setup with Improvements:**

If you'd like to keep Node.js installed within the PHP container:

– **Add NVM (Node Version Manager)**: This makes Node.js version upgrades easier in the future.

# Install NVM for managing Node.js
RUN curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.4/install.sh | bash 
    && . ~/.nvm/nvm.sh && nvm install 20 && nvm use 20 
    && apt-get clean && rm -rf /var/lib/apt/lists/*

– **Install Yarn via NPM (More Portable)**:
While Corepack works, Yarn can be directly installed via NPM for flexibility:

RUN npm install -g yarn

—

#### **3. Install Node.js with Apt and Manage Versions**:

If you want to stick with `apt-get` for simplicity but need flexibility, use `n`:

# Install Node.js 20.x and n (Node.js version manager)
RUN curl -fsSL https://deb.nodesource.com/setup_20.x | bash - && 
    apt-get install -y nodejs && 
    npm install -g n && 
    n 20 && 
    apt-get clean && rm -rf /var/lib/apt/lists/*

—

### **Key Considerations:**

– **PHP 7.3 and Node.js Compatibility**: While Node.js itself won't conflict with PHP, some frontend tooling may require newer PHP or Node.js versions. Ensure your build tools work with the specified versions.
– **Isolation for Frontend Builds**: A multi-stage build keeps frontend tools isolated and reduces the final image size.
– **Flexibility**: Using tools like `n` or `nvm` makes it easier to upgrade Node.js versions later without altering the base image significantly.

Let me know if you'd like a tailored setup for your project!