mailing: 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!

About this issue

Original URL
State: closed
Created 2 years ago
Comments: 20

Most upvoted comments

@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";

alexisveryreal on Sep 9, 2022

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

alexfarrill on Sep 9, 2022

yeah, it just removes the npm -g root altogether. you would only need that if your project were using some packages that are installed globally, which i think is probably atypically, so maybe we were overthinking it. we could add it back in with more refinement if someone raises that problem. for now let’s ship it tho, will do

alexfarrill on Sep 9, 2022

@alexisveryreal would you try 0.7.7-next.0 ? I think that error you posted is thrown before the lines that I changed so would like to see what the output is. Thanks!

@psugihara you can try 0.7.7-next.0 too, I think we should prob release this one since exec’ing npm -g root seems not to work sometimes

alexfarrill on Sep 9, 2022