NextJS: How to exclude backend dependencies from the frontend bundle?
In my nextjs application, I sometimes want use backend dependencies inside my getServerSideProps
or getInitialProps
(if they are executed during server side rendering).
My problem is, that as soon as I import those dependencies in my page file, the nextjs build fails because some dependencies bound to nodejs couldn't be found in the browser for example:Module not found: Can't resolve 'fs'
I also don't want to have those dependencies included in my frontend bundle therefore my current workaround is to require those dependencies only in the serverside code, so they aren't catched by the frontend webpack build, but directly required by nodejs on the serverside:
const userService = require('../../backend/services/user-service'); // eslint-disable-line @typescript-eslint/no-var-requires
const hasSocialLogin = userService.hasSocialLogin(req.user);
But this is not optimal, because now I have no TypeScript support for the typings of my UserService
.
11536 views