Monorepo "Could not resolve" errors @0.7.3

Hello y’all! I wanted to start using this package unfortunately as soon as I ran npx mailing I received a lot of could not resolve errors

Quick Information

• Operating System: Windows 10
• “mailing”: “^0.7.3”,
• “mailing-core”: “^0.7.3”,
• “next”: “^12.2.0”,
• “react”: “17.0.2”,
• “react-dom”: “17.0.2”,

What Happened?

• installed mailing and mailing-core in one of my turborepo apps
• ran npx mailing
• got the following error in my terminal

    ███╗   ███╗ █████╗ ██╗██╗     ██╗███╗   ██╗ ██████╗
    ████╗ ████║██╔══██╗██║██║     ██║████╗  ██║██╔════╝
    ██╔████╔██║███████║██║██║     ██║██╔██╗ ██║██║  ███╗
    ██║╚██╔╝██║██╔══██║██║██║     ██║██║╚██╗██║██║   ██║
    ██║ ╚═╝ ██║██║  ██║██║███████╗██║██║ ╚████║╚██████╔╝
    ╚═╝     ╚═╝╚═╝  ╚═╝╚═╝╚══════╝╚═╝╚═╝  ╚═══╝ ╚═════╝


mailing added mailing.config.json to your project with the following contents:
{
  "typescript": true,
  "emailsDir": "./emails",
  "outDir": "./previews_html"
}

mailing generated your emails dir at ./emails:
emails
├── TextEmail.tsx
├── Welcome.tsx
├── components
│   ├── BulletedList.tsx
│   ├── ButtonPrimary.tsx
│   ├── Footer.tsx
│   ├── Head.tsx
│   ├── Header.tsx
│   └── theme.ts
├── index.ts
└── previews
    ├── TextEmail.tsx
    └── Welcome.tsx
√ enter your email for occasional updates about mailing (optional) ...
mailing ok, no problem
mailing starting preview server
mailing adding .gitignore
✘ [ERROR] Could not resolve "....emails"

    .mailing/src/moduleManifest.ts:2:21:
      2 │ import sendMail from "..\..\emails";
        ╵                      ~~~~~~~~~~~~~~

  You can mark the path "....emails" as external to exclude it from the bundle, which will remove
  this error.

✘ [ERROR] Could not resolve "....emails/TextEmail"

    .mailing/src/moduleManifest.ts:3:22:
      3 │ import TextEmail from "..\..\emails/TextEmail";
        ╵                       ~~~~~~~~~~~~~~~~~~~~~~~~

  You can mark the path "....emails/TextEmail" as external to exclude it from the bundle, which will
  remove this error.

✘ [ERROR] Could not resolve "....emails/Welcome"

    .mailing/src/moduleManifest.ts:4:20:
      4 │ import Welcome from "..\..\emails/Welcome";
        ╵                     ~~~~~~~~~~~~~~~~~~~~~~

  You can mark the path "....emails/Welcome" as external to exclude it from the bundle, which will
  remove this error.

✘ [ERROR] Could not resolve "....emails/previews/TextEmail"

    .mailing/src/moduleManifest.ts:5:34:
      5 │ import * as TextEmailPreview from "..\..\emails/previews/TextEmail";
        ╵                                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  You can mark the path "....emails/previews/TextEmail" as external to exclude it from the bundle,
  which will remove this error.

✘ [ERROR] Could not resolve "....emails/previews/Welcome"

    .mailing/src/moduleManifest.ts:6:32:
      6 │ import * as WelcomePreview from "..\..\emails/previews/Welcome";
        ╵                                 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  You can mark the path "....emails/previews/Welcome" as external to exclude it from the bundle,
  which will remove this error.

G:\dev\d-mls-app\node_modules\esbuild\lib\main.js:1624
  let error = new Error(`${text}${summary}`);
              ^

Error: Build failed with 5 errors:
.mailing/src/moduleManifest.ts:2:21: ERROR: Could not resolve "....emails"
.mailing/src/moduleManifest.ts:3:22: ERROR: Could not resolve "....emails/TextEmail"
.mailing/src/moduleManifest.ts:4:20: ERROR: Could not resolve "....emails/Welcome"
.mailing/src/moduleManifest.ts:5:34: ERROR: Could not resolve "....emails/previews/TextEmail"
.mailing/src/moduleManifest.ts:6:32: ERROR: Could not resolve "....emails/previews/Welcome"
    at failureErrorWithLog (G:\dev\d-mls-app\node_modules\esbuild\lib\main.js:1624:15)
    at G:\dev\d-mls-app\node_modules\esbuild\lib\main.js:1266:28
    at runOnEndCallbacks (G:\dev\d-mls-app\node_modules\esbuild\lib\main.js:1179:65)
    at buildResponseToResult (G:\dev\d-mls-app\node_modules\esbuild\lib\main.js:1264:7)
    at G:\dev\d-mls-app\node_modules\esbuild\lib\main.js:1377:14
    at G:\dev\d-mls-app\node_modules\esbuild\lib\main.js:678:9
    at handleIncomingPacket (G:\dev\d-mls-app\node_modules\esbuild\lib\main.js:775:9)
    at Socket.readFromStdout (G:\dev\d-mls-app\node_modules\esbuild\lib\main.js:644:7)
    at Socket.emit (node:events:526:28)
    at addChunk (node:internal/streams/readable:315:12) {
  errors: [
    {
      detail: undefined,
      id: '',
      location: {
        column: 21,
        file: '.mailing/src/moduleManifest.ts',
        length: 14,
        line: 2,
        lineText: 'import sendMail from "..\\..\\emails";',
        namespace: '',
        suggestion: ''
      },
      notes: [
        {
          location: null,
          text: 'You can mark the path "....emails" as external to exclude it from the bundle, which will remove this error.'
        }
      ],
      pluginName: '',
      text: 'Could not resolve "....emails"'
    },
    {
      detail: undefined,
      id: '',
      location: {
        column: 22,
        file: '.mailing/src/moduleManifest.ts',
        length: 24,
        line: 3,
        lineText: 'import TextEmail from "..\\..\\emails/TextEmail";',
        namespace: '',
        suggestion: ''
      },
      notes: [
        {
          location: null,
          text: 'You can mark the path "....emails/TextEmail" as external to exclude it from the bundle, which will remove this error.'
        }
      ],
      pluginName: '',
      text: 'Could not resolve "....emails/TextEmail"'
    },
    {
      detail: undefined,
      id: '',
      location: {
        column: 20,
        file: '.mailing/src/moduleManifest.ts',
        length: 22,
        line: 4,
        lineText: 'import Welcome from "..\\..\\emails/Welcome";',
        namespace: '',
        suggestion: ''
      },
      notes: [
        {
          location: null,
          text: 'You can mark the path "....emails/Welcome" as external to exclude it from the bundle, which will remove this error.'
        }
      ],
      pluginName: '',
      text: 'Could not resolve "....emails/Welcome"'
    },
    {
      detail: undefined,
      id: '',
      location: {
        column: 34,
        file: '.mailing/src/moduleManifest.ts',
        length: 33,
        line: 5,
        lineText: 'import * as TextEmailPreview from "..\\..\\emails/previews/TextEmail";',
        namespace: '',
        suggestion: ''
      },
      notes: [
        {
          location: null,
          text: 'You can mark the path "....emails/previews/TextEmail" as external to exclude it from the bundle, which will remove this error.'
        }
      ],
      pluginName: '',
      text: 'Could not resolve "....emails/previews/TextEmail"'
    },
    {
      detail: undefined,
      id: '',
      location: {
        column: 32,
        file: '.mailing/src/moduleManifest.ts',
        length: 31,
        line: 6,
        lineText: 'import * as WelcomePreview from "..\\..\\emails/previews/Welcome";',
        namespace: '',
        suggestion: ''
      },
      notes: [
        {
          location: null,
          text: 'You can mark the path "....emails/previews/Welcome" as external to exclude it from the bundle, which will remove this error.'
        }
      ],
      pluginName: '',
      text: 'Could not resolve "....emails/previews/Welcome"'
    }
  ],
  warnings: []
}

• I went to check the moduleManifest.ts file in the .mailing/src/moduleManifest.ts and saw the following

import config from "../../mailing.config.json";
import sendMail from "..\..\emails";
import TextEmail from "..\..\emails/TextEmail";
import Welcome from "..\..\emails/Welcome";
import * as TextEmailPreview from "..\..\emails/previews/TextEmail";
import * as WelcomePreview from "..\..\emails/previews/Welcome";

const previews = { TextEmail: TextEmailPreview, Welcome: WelcomePreview };
const templates = { TextEmail, Welcome };

export { sendMail, config, templates, previews };
const moduleManifest = { sendMail, templates, previews };
export default moduleManifest;

With red typescript errors on the paths with the following typescript error

Cannot find module '....emails' or its corresponding type declarations.ts(2307)

Expected result

• run npx mailing and the import paths are correct and runs with no error

Steps to reproduce

# Install a turborepo from scratch
npx create-turbo@latest

# Chose a dir
Where would you like to create your turborepo? ./mailing-test
# choose npm
? Which package manager do you want to use? npm

# CD into the web app
cd mailing-test/apps/web

# add new dependencies
npm i mailing mailing-core

#run mailing cli
npx mailing

# errors appear :(
✘ [ERROR] Could not resolve "....emails"

   .mailing/src/moduleManifest.ts:2:21:
     2 │ import sendMail from "..\..\emails";

Screenshots

Please let me know if you need anything else!

[alexisveryreal]

@alexfarrill No more npm -g root error, but paths errors are still there. This time though they are all the same type of slash at least.

So 0.7.3 import TextEmail from "..\..\emails/TextEmail";

0.7.7-next-0 import TextEmail from "..\..\emails\TextEmail";

[alexfarrill]

if you want to add some detail on how to setup turborepo to #178 that one should be easy to implement