#Unable to import .imba files with plugin

1 messages · Page 1 of 1 (latest)

wheat timber
#

Hey!

I wrote a simple plugin for an Imba (.imba) loader. Following the docs:

// imbaPlugin.js
import { plugin } from "bun";

await plugin({
  name: "imba loader",
    setup(build) {
        const { compile } = await import("imba/dist/compiler.js");
        const { readFileSync } = await import("fs");
        
    build.onLoad({ filter: /\.imba$/ }, (args) => {
      // read the .imba file
      const text = readFileSync(args.path, "utf8");

      // compile it with the Imba compiler
      const options = {
        target: "web",
        format: "esm",
        es6: true,
        standalone: false,
        sourceMap: true,
        evaling: true,
        css: false,
        filename: basename(args.path),
        sourceRoot: "",
        sourcePath: basename(args.path),
        targetPath: "",
      };

      let { js, sourcemap } = compile(text, options);

      // and return the compiled source code as "js"
      return {
        contents: js,
        loader: "js",
      };
    });
  },
});
// index.js
import "./imbaPlugin.js";
import index from "./app/index.imba";

console.log(index.render());

This is the error I see:

$ bun run index.js
Unsupported loader file for path: /Users/blokku/bun-quickstart/app/index.imba

uh-oh: Unsupported loader file for path: /Users/blokku/bun-quickstart/app/index.imba
bun will crash now 😭😭😭

----- bun meta -----
Bun v0.7.1 (53cc4df1) macOS Silicon 22.6.0
RunCommand: 
Elapsed: 13ms | User: 10ms | Sys: 11ms
RSS: 21.74MB | Peak: 21.74MB | Commit: 35.68MB | Faults: 42
----- bun meta -----

0   0x10202eb4c WTFGetBacktrace
1   ??? Bun__crashReportDumpStackTrace

Crash report saved to:
  ~/.bun/.bun-crash/v0.7.1-1690796153431.crash

Search GitHub issues https://bun.sh/issues or ask for #help in https://bun.sh/discord

thread 13757688 panic: Unsupported loader file for path: /Users/blokku/bun-quickstart/app/index.imba
error: script "start" exited with code 6 (SIGABRT)
paper summit
#

Can you try in the acnary build?

#

I think the async transpiler broke some stuff

#

bun upgrade --canary

wheat timber
#

Upgraded now, some progress:

$ bun run index.js


error: Expected ";" but found "import"

        const { compile } = await import("imba/dist/compiler.js");
                            ^
/Users/blokku/bun-quickstart/imbaPlugin.js:6:29 113


error: Expected ";" but found "import"

        const { readFileSync } = await import("fs");
                                 ^
/Users/blokku/bun-quickstart/imbaPlugin.js:7:34 179
wheat timber
#

According to the docs

wheat timber
#

Ok, I got plugin working. Seems the compile wasn't working because of an imba version mismatch. There's a new issue, but I'll reach out again if I can't figure it out

wheat timber
#

It seems like everything is setup right from my end, the compiled js looks fine, but I'm getting this:

var $b = Symbol();
import 'imba/src/imba/index';
class TestComponent extends imba.tags.get('component','ImbaElement') {
    
    render(){
        var $1t, $1b, $1d, $0 = this._ns_ || '', $2t, $3t, $4t;
        $1t=this;
        $1t.open$();
        ($1b=$1d=1,$1t[$b] === 1) || ($1b=$1d=0,$1t[$b]=1);
        $1b || ($2t=imba.createElement('html',$1t,`${$0}`,null));
        $1b || ($2t.lang="en");
        $1b || ($3t=imba.createElement('head',$2t,`${$0}`,null));
        $1b || ($4t=imba.createElement('meta',$3t,`${$0}`,null));
        $1b || ($4t.charset="UTF-8");
        $1b || ($4t=imba.createElement('meta',$3t,`${$0}`,null));
        $1b || ($4t.name="viewport");
        $1b || ($4t.content="width=device-width, initial-scale=1.0");
        $1b || ($4t=imba.createElement('title',$3t,`${$0}`,"Quickstart"));
        $1b || ($3t=imba.createElement('body',$2t,`${$0}`,null));
        $1b || ($4t=imba.createElement('div',$3t,`${$0}`,null));
        $1b || ($4t.id="app");
        $1b || ($4t=imba.createElement('script',$3t,`${$0}`,null));
        $1b || ($4t.type="module");
        $1b || ($4t.src="/main.js");
        $1t.close$($1d);
        return $1t;
    }
}; imba.tags.define('test',TestComponent,{});



error: Could not resolve: "imba/src/imba/index". Maybe you need to "bun install"?

import 'imba/src/imba/index';
       ^

I've checked and imba/src/imba/index exists in the node_modules

#

@paper summit Is it because it isnt explicitly saying index.imba?

paper summit
#

does the package.json use "exports"?

wheat timber
#

Here's the package.json of imba:

{
  "name": "imba",
  "description": "Intuitive and powerful language for building webapps that fly",
  "keywords": [
    "javascript",
    "language",
    "imba",
    "compiler"
  ],
  "author": "Sindre Aarsaether",
  "license": "MIT",
  "contributors": [
    {
      "name": "Sindre Aarsaether",
      "email": "[email protected]",
      "url": "https://github.com/somebee/"
    },
    {
      "name": "Magnus Holm",
      "email": "[email protected]",
      "url": "https://github.com/judofyr/"
    },
    {
      "name": "Slee Woo",
      "url": "https://github.com/sleewoo/"
    },
    {
      "name": "Luke Edwards",
      "email": "[email protected]",
      "url": "https://github.com/lukeed/"
    },
    {
      "name": "Gavin Ray",
      "url": "https://github.com/GavinRay97/"
    },
    {
      "name": "Alexander Alemayhu",
      "url": "https://github.com/scanf/"
    }
  ],
  "scripts": {
    "bootstrap": "node scripts/bootstrap.js",
    "build-parser": "node scripts/generate-parser.js",
    "test": "node scripts/bootstrap.js && bin/imba scripts/test-runner.imba",
    "test-fast": "node scripts/bootstrap.js && bin/imba scripts/test-runner.imba -c",
    "clean": "find test/apps -name '*.js' -type f -delete && rm -r dist/",
    "build": "node scripts/bootstrap.js && webpack --mode=none",
    "prerelease": "lerna publish --dist-tag pre",
    "watch": "npm run build -- --watch"
  },
  "bugs": "https://github.com/imba/imba/issues",
  "version": "2.0.0-alpha.84",
  "licenses": [
    {
      "type": "MIT",
      "url": "https://github.com/imba/imba/raw/master/LICENSE"
    }
  ],
  "engines": {
    "node": ">=10.0.0"
  },
  "directories": {},
  "main": "./index.js",
  "browser": "./dist/imba.js",
  "bin": {
    "imba": "./bin/imba",
    "imbac": "./bin/imbac",
    "imbapack": "./bin/imbapack"
  },
  "preferGlobal": true,
  "homepage": "https://imba.io",
  "repository": {
    "type": "git",
    "url": "git://github.com/imba/imba.git"
  },
  "devDependencies": {
    "puppeteer": "^2.1.1",
    "raw-loader": "^3.1.0",
    "rollup": "^1.27.11",
    "rollup-plugin-commonjs": "^10.1.0",
    "rollup-plugin-node-resolve": "^5.2.0",
    "webpack": "^4.41.5",
    "webpack-cli": "^3.3.10",
    "webpack-dev-server": "^3.9.0"
  },
  "gitHead": "abd905f2ca0a871422c5aeec75e7b69180708264"
}
paper summit
#

looks very reasonable

paper summit
#

(basically, if it's not .js, .esm, .mts, .mjs, .cts, .ts, .tsx, .jsx)

wheat timber
#

Oh! I updated the imba package and the exports are now stated in the package.json:

"exports": {
    "./preflight.css": "./preflight.css",
    "./server": "./dist/imba.node.mjs",
    ".": {
      "imba": "./src/imba/imba.imba",
      "browser": "./dist/imba.mjs",
      "default": "./index.js"
    },
    "./spec": {
      "imba": "./src/utils/spec.imba"
    },
    "./program": "./program.imba.js",
    "./workers": "./workers.imba.js",
    "./compiler": {
      "browser": "./dist/compiler.mjs",
      "require": "./dist/compiler.cjs",
      "default": "./dist/compiler.mjs"
    }
  },
#

@paper summit Is this sufficient?

paper summit
#

should be

#

though "." => "imba"

#

i don't think that works

#

there is no "imba" export condition

wheat timber
paper summit
#

Sounds like it’s loading something meant for browsers

#

Instead of bun

#

Though if you’re targeting bundling

#

That should be fine