vikejs / vike

🔨 Flexible, lean, community-driven, dependable, fast Vite-based frontend framework.
https://vike.dev
MIT License
4.35k stars 350 forks source link

Build server with tsup fails #434

Closed devunt closed 2 years ago

devunt commented 2 years ago

Description

First of all, I'm really enjoying using VPS and in the middle of progress transitioning production Next.js app to Vite + VPS.

Meanwhile, building entrypoint src/server/index.ts file with tsup fails with following errors. I'm using tsup for transpiling .ts file to esm .js and minifying it for dockerization.

Versions

(All packages are on its latest version)

Error Stack

> tsup && vite build

CLI Building entry: src/server/index.ts
CLI Using tsconfig: tsconfig.json
CLI tsup v6.2.3
CLI Using tsup config: /Users/devunt/workspace/ccoli/frontend/tsup.config.ts
CLI Target: node18
ESM Build start
✘ [ERROR] Could not resolve "../../../../../../../dist/server/importBuild.cjs"

    node_modules/.pnpm/@brillout+vite-plugin-import-build@0.1.0/node_modules/@brillout/vite-plugin-import-build/dist/autoImporter.js:2:31:
      2 │ exports.load = () => { require('../../../../../../../dist/server/importBuild.cjs') };
        ╵                                ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

ESM Build failed

src/server/index.ts file

import middie from '@fastify/middie';
import fastify from 'fastify';
import path from 'path';
import { fileURLToPath } from 'url';
import { renderPage } from 'vite-plugin-ssr';

const root = path.dirname(path.dirname(path.dirname(fileURLToPath(import.meta.url))));

const app = fastify();
await app.register(middie);

if (process.env.NODE_ENV === 'development') {
  const vite = await import('vite');
  const server = await vite.createServer({ root, appType: 'custom', server: { middlewareMode: true } });
  await app.use(server.middlewares);
} else {
  const _static = await import('@fastify/static');
  await app.register(_static, { root: path.join(root, 'dist/client'), wildcard: false });
}

app.get('*', async (request, reply) => {
  const { httpResponse } = await renderPage({ urlOriginal: request.url });
  if (httpResponse === null) {
    return reply.status(500).send('Internal Server Error');
  }

  const { statusCode, contentType, body } = httpResponse;
  return reply.status(statusCode).type(contentType).send(body);
});

try {
  const address = await app.listen({ host: '0.0.0.0', port: 3000 });
  console.log(`🚀 Vite server is running on ${address}...`);
} catch (e) {
  console.error(e);
  process.exit(1);
}

tsup.config.ts file


import { defineConfig } from 'tsup';

export default defineConfig({
  entry: ['src/server/index.ts'],
  target: 'node18',
  format: 'esm',
  minify: true,
});
devunt commented 2 years ago

Neverminds, my fault. After changing tsup && vite build to vite build && tsup it works like a charm. I'm gonna leaving this issue for dumbs like me.