Ketsebaot Gizachew Posts - Answer Overflow

Ketsebaot Gizachew

•Created by Ketsebaot Gizachew on 2/8/2025 in #❓・help

Nuxt Error cannot Start Cannot Find Package:plugin-transform-typescript

hey guys i have a very simple minimal project with nuxt/ui and i am getting this error when trying to start it what is the problem:

[nuxi 6:23:40 ከሰዓት]  ERROR  Cannot start nuxt:  Cannot find package 'C:\Users\admin\Desktop\Full Typescript Projects\cognito 1.0\COSMO\node_modules\.pnpm\[email protected][email protected]_@[email protected][email protected][email protected][email protected][email protected]_\node_modules\@babel\plugin-transform-typescript\lib\index.js' imported from C:\Users\admin\Desktop\Full Typescript Projects\cognito 1.0\COSMO\node_modules\.pnpm\[email protected][email protected]_@[email protected][email protected][email protected][email protected][email protected]_\node_modules\vite-plugin-vue-inspector\dist\index.mjs
Did you mean to import "@babel/plugin-transform-typescript/lib/index.js"?

[nuxi 6:23:40 ከሰዓት]  ERROR  Cannot start nuxt:  Cannot find package 'C:\Users\admin\Desktop\Full Typescript Projects\cognito 1.0\COSMO\node_modules\.pnpm\[email protected][email protected]_@[email protected][email protected][email protected][email protected][email protected]_\node_modules\@babel\plugin-transform-typescript\lib\index.js' imported from C:\Users\admin\Desktop\Full Typescript Projects\cognito 1.0\COSMO\node_modules\.pnpm\[email protected][email protected]_@[email protected][email protected][email protected][email protected][email protected]_\node_modules\vite-plugin-vue-inspector\dist\index.mjs
Did you mean to import "@babel/plugin-transform-typescript/lib/index.js"?

here is my nuxt.config.ts

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  compatibilityDate: '2024-11-01',
  devtools: { enabled: true },
  modules: ['@nuxt/ui'],
  css: ['~/assets/css/main.css']
})

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  compatibilityDate: '2024-11-01',
  devtools: { enabled: true },
  modules: ['@nuxt/ui'],
  css: ['~/assets/css/main.css']
})

and my package.json

{
  "name": "nuxt-app",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "dependencies": {
    "@nuxt/ui": "3.0.0-alpha.12",
    "nuxt": "^3.15.4",
    "vue": "latest",
    "vue-router": "latest"
  },
  "packageManager": "[email protected]+sha512.b2dc20e2fc72b3e18848459b37359a32064663e5627a51e4c74b2c29dd8e8e0491483c3abb40789cfd578bf362fb6ba8261b05f0387d76792ed6e23ea3b1b6a0"
}

{
  "name": "nuxt-app",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "dependencies": {
    "@nuxt/ui": "3.0.0-alpha.12",
    "nuxt": "^3.15.4",
    "vue": "latest",
    "vue-router": "latest"
  },
  "packageManager": "[email protected]+sha512.b2dc20e2fc72b3e18848459b37359a32064663e5627a51e4c74b2c29dd8e8e0491483c3abb40789cfd578bf362fb6ba8261b05f0387d76792ed6e23ea3b1b6a0"
}

5 replies

NNuxt

•Created by Ketsebaot Gizachew on 1/27/2025 in #❓・help

Deploying Nuxt which has server/api functions to vercel and make them able to load files

i was working on a project where i have nuxt ./server/api/mdx.ts which is responsible for loading a file when requested i tried loading using fs which resulted in errors because the server functions run in a separate enviroment on vercel. then after searching around a bit i decided to have a nitro asset setup like this: nuxt.config.ts:

// the rest of nuxt setup
nitro: {
    storage: {
      mdxassets: {
        driver: 'fs',
        base: "./documentation"
      },
    },
    compressPublicAssets: {
      brotli: true,
      gzip: true
    }
  },
// the rest of nuxt setup

// the rest of nuxt setup
nitro: {
    storage: {
      mdxassets: {
        driver: 'fs',
        base: "./documentation"
      },
    },
    compressPublicAssets: {
      brotli: true,
      gzip: true
    }
  },
// the rest of nuxt setup

mdx.ts:

export default defineEventHandler(async (event) => {
  try {
    // Ensure the request method is POST
    if (event.req.method !== 'POST') {
      console.warn('Mdx Ignoring non-POST request:', {
        method: event.req.method,
        url: event.req.url,
      });
      return {
        statusCode: 405,
        body: 'Method Not Allowed',
      };
    }

    // Read the file path from the request body
    const { filePath } = await readBody(event);

    if (!filePath) {
      console.error('No file path provided');
      return {
        statusCode: 400,
        body: 'No file path provided',
      };
    }

    // Use the storage API to fetch the file
    const storage = useStorage('mdxassets');
    let file = await storage.getItem(filePath).then((x) => x?.toString());

    if (!file) {
      console.log('What was found: ', storage);
      console.error('File not found or could not be read:', filePath);
      return {
        statusCode: 404,
        body: 'File not found or could not be read',
      };
    }

    console.log('File Content:', file);

export default defineEventHandler(async (event) => {
  try {
    // Ensure the request method is POST
    if (event.req.method !== 'POST') {
      console.warn('Mdx Ignoring non-POST request:', {
        method: event.req.method,
        url: event.req.url,
      });
      return {
        statusCode: 405,
        body: 'Method Not Allowed',
      };
    }

    // Read the file path from the request body
    const { filePath } = await readBody(event);

    if (!filePath) {
      console.error('No file path provided');
      return {
        statusCode: 400,
        body: 'No file path provided',
      };
    }

    // Use the storage API to fetch the file
    const storage = useStorage('mdxassets');
    let file = await storage.getItem(filePath).then((x) => x?.toString());

    if (!file) {
      console.log('What was found: ', storage);
      console.error('File not found or could not be read:', filePath);
      return {
        statusCode: 404,
        body: 'File not found or could not be read',
      };
    }

    console.log('File Content:', file);

this setup works fine on my pc bot in dev mode and build but doesn't work on vercel and with useSthorage i don't know the errors because it doesn't give me one but it silently isn't able to load it just on vercel. with my file i am trying to load is in the root dir. of my project inside a folder called docs.

5 replies

Gaming

Programming