Can't resolve 'fs' about sql.js HOT 7 CLOSED

@rossjs I'm facing the same problem. This will be a issue with every js bundler trying to resolve the module sql.js/dist/sql-wasm.js for a frontend application.

My current workaround is to keep the js file in index.html and out of the bundler 😞

<script src="/assets/sql-js/sql-wasm.js"></script>

in a typescript frontend application it could be used like this:

  (window as any).initSqlJs({
       // Required to load the wasm binary asynchronously.
       locateFile: () => '/assets/sql-js/sql-wasm.wasm'
  }).then((instance: any) => {
      (window as any).SQL = instance;
  });

Here is a open PR for this issue:
#539

from sql.js.

I had a similar issue. The problem is how you invoke the library.

Instead of doing,
const initSqlJs = require('sql.js');

Do the following:
// or if you are in a browser:
const initSqlJs = window.initSqlJs;

That solved my issue.

from sql.js.

I actually ended up switching to use Vite as my bundler due to this issue and found that works. Still learning the differences between it and CRA, but it's been relatively painless so far. I'm also using the sql.js hosted wasm file for now.

import initSqlJs from 'sql.js';

const initDb = async () => {
  const SQL = await initSqlJs({ locateFile: (file) => `https://sql.js.org/dist/${file}` });
  return new SQL.Database();
};

// vite.config.js

import { defineConfig } from 'vite';
import wasm from 'vite-plugin-wasm';
import react from '@vitejs/plugin-react';
import eslint from 'vite-plugin-eslint';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    wasm(),
    react({
      // hot reload doesn't work without this ¯\_(ツ)_/¯
      include: '**/*.jsx',
    }),
    eslint(),
  ],
  // vite doesn't expose process.env and sql.js expects it
  define: {
    'process.env': {},
  },
});

from sql.js.

Thanks for sharing @rossjs ! vite.js looks really nice 👍 unfortunately, I can’t exchange the bundler in near future (and I think many developers are in the same situation) … so I keep having high hopes that this library will become compatible with webpack again some day :)

from sql.js.

Hey are you using esbuild? if yes, you can mark fs and path as external module(see https://esbuild.github.io/api/#external ),afterwards esbuild will ignore this error and that require will never run in a browser.

from sql.js.

you need to add fallback in resolve object in react script/config/webpack-config.js in node_module
fallback: {fs:false },

from sql.js.

It sounds like there's some some paths forward by updating the webpack config or switching to vite. It also seems like CRA is only getting the absolute bare minimum of support these days and isn't a great path forward long term so I'm going to go ahead and close out this issue. Feel free to open up a new one if you think it warrants it.

Thanks for all the suggestions everyone!

from sql.js.