Hey everyone!
This is my first blog post on Dev.to, and I'm super excited to share something that helped me a lot while working with TurboRepo. I ran into a common problem, solved it in a clean way, and thought — why not write about it?
Hope it helps you too. Feedback is always welcome!

Let’s face it — juggling images and icons across multiple apps in a TurboRepo can feel like untangling a mess of earphones.You copy assets from one app to another… forget where you saved a particular icon… or worse, end up with five versions of the same logo.

Image and Icons in Turborepo

It’s chaotic. It’s inefficient. And it doesn’t have to be this way.

If you’re already using TurboRepo, you know how powerful modular, scalable app development can be. But what if you could take it a step further and centralize all your static assets — icons, images, logos — into one place and share them effortlessly across your entire monorepo?

In this blog, I’ll walk you through a clean and effective way to manage shared assets in a TurboRepo setup.No more duplication. No more broken image paths. Just one unified source of truth for your visuals.

Instead of duplicating assets across apps, treat them like shared components or utilities.

Let’s create a shared package called @repo/assets to hold all icons and images.

Static Assets in Turborepo

📦 Step 1: Create the assets package

mkdir packages/assets

📂 Step 2: Add src folder and package.json

cd packages/assets
mkdir src
touch package.json

package.json content:

{
  "name": "@repo/assets",
  "version": "1.0.0",
  "description": "Static Assets (Images/Icons) to be used in all the workspaces",
  "main": "src/index.ts",
  "module": "src/index.ts",
  "types": "src/index.d.ts",
  "files": [
    "src/**/*"
  ],
  "author": "Dev Ashwani",
  "license": "MIT",
  "scripts": {
    "build": "tsc"
  }
}

🗂 Step 3: Organize your assets

cd packages/assets
touch index.ts

cd src
mkdir icons (To place all your icons)
mkdir images (To place all your images)

Example structure:

packages/assets/
├── src/
│   ├── icons/
│   │   └── user.svg
│   ├── images/
│   │   └── no-data.png
│   └── index.ts
└── package.json

✅ Step 4: Export assets in index.ts

export const images = {
  noData: require("./images/no-data.png"),
};

export const icons = {
  user: require("./icons/user.svg"),
}

const assets = { images, icons };
export default assets;

🛠️ Step 5: Use the package in your app

1.Add it as a dependency in your app's package.json

"dependencies": {
    "@reduxjs/toolkit": "^2.5.0",
    "@repo/assets": "*",
  },

2.Import & use it in your components

import { icons, images } from "@repo/assets";
import Image from "next/image";

const Home = () => {
  return (
    <>
      
      
    >
  );
};

🎉 That’s it!

You’ve now got a clean, scalable way to manage and share static assets across your TurboRepo apps. No more duplication, confusion, or messy file structures.

A shared asset package is a simple but powerful pattern — and once you start using it, you’ll never go back.

Happy coding!