I created a minimal example to show the question I have: Github Repo

I have a lerna monorepo with two npm packages in the packages folder, the packages are called:

utils: exports a function:

export const add = (a:number, b: number) => a + b

component-library:: exports one simple functional React component:

import React from 'react';
import { add } from '@project/utils';

export const MyComponent = () => <div>{add(2, 2)}</div>;

The root of the monorepo has a tsconfig.json, which defines a paths key to map any imports of the form @project/* to the packages.

{
  "compilerOptions": {
    "jsx": "react",
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "moduleResolution": "node",
    "allowJs": true,
    "baseUrl": ".",
    "paths": {
      "@project/*": ["packages/*/src"]
    }
  },
  "exclude": ["**/build/**"]
}

Each package has a rollup.config.js, both essentially identical (though we're only going to use the one in the component-library package here):

import typescript from '@rollup/plugin-typescript';
import commonjs from '@rollup/plugin-commonjs';

export default {
    input: 'src/index.tsx',
    output: {
        dir: './build',
        format: 'cjs'
    },
    plugins: [
        commonjs(),
        typescript({ tsconfig: '../../tsconfig.json'}),
    ]
};

Therefore, they both use the paths defined in the root tsconfig.json, and they use a plugin for transpiling Typescript.

component-library imports a function from @project/utils called add(a,b).

My goal is to create a build of this library (using rollup), without having to build the utils package first. In other words, I want to build component-library resolving imports from utils to the source code of utils, not the build folder in the symlinked package in node_modules (ie, not using the symlinks created by lerna).

I almost achieve this, except that when I run the build script in component-library, I get an error:

src/index.tsx → ./build... [!] Error: Unexpected token (Note that you need plugins to import files that are not JavaScript) ..\utils\src\index.ts (1:21) 1: export const add = (a:number, b: number) => a + b ^

The way I understand this, it means that the resolution of the import works fine, but rollup is not transpiling the TS file coming from an external dependency.

How do I tell rollup to include the file from utils in the transpilation through rollup?