Creating your own loader

Let's create a custom loader to load C files.

1. Create a new file called cLoader.ts.

2. Inside it, we'll extend the Loader class and add our configuration to it.

   import { Loader } from "hyperimport";
   import { basename, parse } from "path";
   
   export default class extends Loader {
       constructor() {
           super("C Loader",
               {
                   extension: "c",
                   buildCommand: (importPath, outDir) => [
                       "gcc",
                       "-shared",
                       "-fpic",
                       importPath,
                       "-o",
                       `${outDir}/lib${parse(importPath).name}.so`
                   ],
                   outDir: importPath => `build/${basename(importPath)}`
               }
           );
       }
   };

3. Add the file path to custom in hyperimport config inside bunfig.toml.

   [hyperimport]
   custom = ["./cLoader.ts"]

4. Create a new C file called math.c.

5. Inside it, we'll write a simple function to add two integers.

   int math(int a, int b) {
     return a + b;
   }

6. Inside index.ts, import the math function from math.c.

   import { math } from "./math.c";
   
   console.log(math(10, 5));

   You'll see the typescript error Cannot find module when importing that, don't worry, it gets fixed in the next steps.

7. Now simply run bun . to execute index.ts.

8. You'll see something like,

   [HYPERIMPORT]: C Loader
   No configuration was found for "/hypertest/math.c"
   Enter the build command and output directory to configure it.
   Press enter to use the default values.
   
   build command: (default)
   

   It means, hyperimport successfully registered our custom "C Loader" we created earlier.

9. Press enter to go with the default values.

10. Now you'll see something like,

    Config file has been generated at "/hypertest/@types/math.c/config.ts"
    Edit the config.ts and set the argument and return types, then rerun the script.
    

11. Navigate to the newly created file @types/math.c/config.ts.

12. Inside you'll find the configuration to load math.c. Add the argument and return types for the math function.

    math: {
        args: [T.int, T.int],
        returns: T.int
    }

    This tells FFI that, the math function takes two ints as arguments and returns an int as a result.

13. At this step, you'll notice the typescript error we got earlier is now resolved and if you hover over the math function, you'll find it is now properly typed.

14. For the final step, run bun . again to rerun the script.

15. 10 is successfully logged into the console as it should.

16. To check auto reloading, go back to math.c.

17. Change the + to -.

18. Run bun . again.

19. Hyperimport automatically rebuilds the changed code and logs 5 into the console.