Error on launch: "Only file and data URLs are supported by the default ESM loader"

hugoattal commented 2 years ago

Hey! So I'm trying to set up Peeky for my current project.

I'm on Windows 11 with:

node 16.13.1 (LTS)
vue 3.2.26 (latest)
vite 2.7.5 (latest)
@peeky/test 0.9.3 (latest)

The project works with vite dev and vite build. Jest and Vitest works flawlessly. But in the same project, when I launch peeky test I get this error:

 ERROR  Running tests failed: Error: Only file and data URLs are supported by the default ESM loader. On Windows, absolute paths must be valid file:// URLs. Received protocol 'd:'(/node_modules/lodash/lodash.js) (/src/modules/application/lib/treeDoc.ts) (/@fs/D:/Library/Projects/LunaPark/frontend/src/modules/application/lib/treeDoc.spec.ts)
    at new NodeError (node:internal/errors:371:5)
    at defaultResolve (node:internal/modules/esm/resolve:1016:11)
    at ESMLoader.resolve (node:internal/modules/esm/loader:422:30)
    at ESMLoader.getModuleJob (node:internal/modules/esm/loader:222:40)
    at ESMLoader.import (node:internal/modules/esm/loader:276:22)
    at importModuleDynamically (node:internal/modules/esm/translators:111:35)
    at importModuleDynamicallyCallback (node:internal/process/esm_loader:35:14)
    at cachedRequest (file:///D:/Library/Projects/LunaPark/frontend/node_modules/@peeky/runner/src/runtime/vite.ts:105:38)
    at D:/Library/Projects/LunaPark/frontend/src/modules/application/lib/treeDoc.ts:1:281
    at rawRequest (file:///D:/Library/Projects/LunaPark/frontend/node_modules/@peeky/runner/src/runtime/vite.ts:210:7)

It seems to be triggered when I import lodash (and lodash probably import some other thing with an absolute path)

I'm still not quite sure if it's a Peeky bug, a Vite bug, or just me forgetting to update some configuration, but I can't find anything on that ESM Loader...

Here is my vite.config.ts file if it helps:

import * as path from "path";
import { defineConfig, UserConfig } from "vite";
import vue from "@vitejs/plugin-vue";

const alias = {
    "@": path.resolve(__dirname, "src")
};

export default defineConfig(({ command }) => {
    const config: UserConfig = {
        plugins: [vue()],
        resolve: {
            alias
        },
        server: {
            port: 8080
        },
        test: {
            runtimeEnv: "dom"
        }
    };

    if (command === "build") {
        config.base = "/static/";
    }

    return config;
});

hugoattal commented 2 years ago

This seems to be a common issue: https://github.com/nodejs/node/issues/31710 Which is solved by using the url.pathToFileURL function (example with vue-cli: https://github.com/vuejs/vue-cli/pull/6869/files)

It might be the same kind of issue in peeky?

Aaaah people reported the same bug in the end of this issue: https://github.com/Akryum/peeky/issues/2 I'm not the only one 😅

hugoattal commented 2 years ago

I wonder if this function is right: https://github.com/Akryum/peeky/blob/34826cbd1a2c3beba65b13de44cbda6532c6512a/packages/peeky-utils/src/fs.ts#L5

Shouldn't this be something like that?

const path = require('path')
const URL = require('url')

export function fixWindowsAbsoluteFileUrl (path: string) {
    return path.isAbsolute ? URL.pathToFileURL(path).href : path;
    // or just return URL.pathToFileURL(path).href ?
}

I'll try to setup the project to see if that fixes it.

EDIT: Annnnd, the scripts use the "&&" symbol which does not work on Windows 😩... Seems like I'll have to install WSL...

EDIT2: I don't understand, it works perfectly with the example from your repo. I'll try to create a minimum example...

EDIT3: OKAY! It may have to do with npm! When I install the dependencies of the demo with npm install I get the error, but if I use pnpm install everything work! Think is, I also use storybook which is kinda broken with pnpm...

hugoattal commented 2 years ago

In the end, it works with PNPM 🥳 !