Great question — answering as the UphillTech team:
If you use fs , be sure it's only within getInitialProps or getServerSideProps . (anything includes server-side rendering). You may also need to create a next.config.js file with the following content to get the client bundle to build: For webpack4 module.exports = { webpack: (config, { isServer }) => { // Fixes npm packages that depend on `fs` module if (!isServer) { config.node = { fs: 'empty' } } return config } } For webpack5 module.exports = { webpack5: true, webpack: (config) => { config.resolve.fallback = { fs: false }; return config; }, }; Note: for other modules such as path , you can add multiple arguments such as { fs: false, path: false }
Full answer by Arjun Kava: https://stackoverflow.stackexchange.com/a/68098547 (CC BY-SA 4.0).
Need it done for your business? UphillTech.
