SolidJS•10mo ago

Cannot find module

When running unit test am facing this error

Error: Cannot find module '.../node_modules/.pnpm/@[email protected][email protected]/node_modules/@solidjs/router/dist/integration' imported from /node_modules/.pnpm/@[email protected][email protected]/node_modules/@solidjs/router/dist/routing.js

Error: Cannot find module '.../node_modules/.pnpm/@[email protected][email protected]/node_modules/@solidjs/router/dist/integration' imported from /node_modules/.pnpm/@[email protected][email protected]/node_modules/@solidjs/router/dist/routing.js

here is my vitest.config.ts configuration

export default mergeConfig(viteConfig, defineConfig({
  test: {
    setupFiles: [
      "./tests/init.ts",
    ],
    environment: "jsdom",
    globals: true,
    threads: false,
    isolate: false,
    includeSource: ["src/**/*.{js,ts,tsx,jsx}"],
    transformMode: {
      web: [/\.[jt]sx?$/],
    },
    open: false,
  },
  resolve: {
    conditions: ["development", "browser"],
  },
}));

export default mergeConfig(viteConfig, defineConfig({
  test: {
    setupFiles: [
      "./tests/init.ts",
    ],
    environment: "jsdom",
    globals: true,
    threads: false,
    isolate: false,
    includeSource: ["src/**/*.{js,ts,tsx,jsx}"],
    transformMode: {
      web: [/\.[jt]sx?$/],
    },
    open: false,
  },
  resolve: {
    conditions: ["development", "browser"],
  },
}));

26 Replies

Birk Skyum•10mo ago

Are you able to update to a more recent version of the router?

Yisacc - Full Stack DevOP•10mo ago

@Birk Skyum am not using @solidjs/route am using file routes

Birk Skyum•10mo ago

Okay, text you posted contain @[email protected]. What version of solid start do you have?

Yisacc - Full Stack DevOP•10mo ago

"solid-start": "^0.3.10",

bigmistqke•10mo ago

afaik FileRouter uses @solidjs/router under the hood. In fact it's just a way to configure the solid-router with the file-system. would be helpful if you could copy paste ur package.json

Birk Skyum•10mo ago

@Yisacc - Full Stack Dev that is a quite old version of solid start. The newer versions are published as @solidjs/start. You might benefit from upgrading.

Yisacc - Full Stack DevOP•10mo ago

  "dependencies": {
    "@modular-forms/solid": "^0.19.1",
    "@solid-primitives/analytics": "^0.1.5",
    "@solid-primitives/date": "^2.0.19",
    "@solid-primitives/script-loader": "^2.0.2",
    "@solid-primitives/storage": "^2.1.1",
    "@tanstack/solid-table": "^8.9.3",
    "@unocss/reset": "^0.53.4",
    "@walletconnect/modal": "^2.6.2",
    "@web3-onboard/injected-wallets": "^2.10.5",
    "alchemy-sdk": "^3.1.0",
    "chart.js": "^4.3.3",
    "chartjs-adapter-date-fns": "^3.0.0",
    "clsx": "^2.0.0",
    "cva": "npm:class-variance-authority@^0.6.1",
    "date-fns": "^2.30.0",
    "eth-chains": "^2.0.0",
    "ethers": "^6.7.1",
    "flat-cache": "^4.0.0",
    "graphql-request": "^6.1.0",
    "graphql-tag": "^2.12.6",
    "gsap": "^3.12.4",
    "solid-chartjs": "^1.3.8",
    "solid-icons": "^1.0.11",
    "solid-js": "^1.8.5",
    "solid-start": "^0.3.10",
    "solid-toast": "^0.5.0",
    "swiper": "^10.3.1",
    "tailwind-merge": "^1.13.2",
    "undici": "^5.22.1",
    "vite-plugin-solid": "^2.7.2",
    "zod": "^3.21.4"
  },
  "devDependencies": {
    "@antfu/eslint-config": "^0.39.4",
    "@faker-js/faker": "^8.0.2",
    "@iconify-json/mdi": "^1.1.52",
    "@playwright/test": "^1.37.1",
    "@solidjs/testing-library": "^0.8.3",
    "@types/flat-cache": "^2.0.2",
    "@types/node": "^20.2.5",
    "@typescript-eslint/parser": "^5.59.8",
    "@vitest/ui": "^0.32.2",
    "eslint": "^8.41.0",
    "eslint-plugin-jsx-a11y": "^6.7.1",
    "eslint-plugin-solid": "^0.12.1",
    "eslint-plugin-storybook": "^0.6.13",
    "eslint-plugin-tailwindcss": "^3.12.1",
    "eslint-plugin-unicorn": "^47.0.0",
    "jsdom": "^22.1.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "solid-start-node": "^0.3.10",
    "typescript": "^5.0.4",
    "unocss": "^0.53.4",
    "vite": "^4.4.9",
    "vite-plugin-solid-svg": "^0.6.4",
    "vite-tsconfig-paths": "^4.2.1",
    "vitest": "^0.31.3"
  },
  "pnpm": {},
  "resolutions": {
    "vite-plugin-inspect": "0.7.38"
  }

  "dependencies": {
    "@modular-forms/solid": "^0.19.1",
    "@solid-primitives/analytics": "^0.1.5",
    "@solid-primitives/date": "^2.0.19",
    "@solid-primitives/script-loader": "^2.0.2",
    "@solid-primitives/storage": "^2.1.1",
    "@tanstack/solid-table": "^8.9.3",
    "@unocss/reset": "^0.53.4",
    "@walletconnect/modal": "^2.6.2",
    "@web3-onboard/injected-wallets": "^2.10.5",
    "alchemy-sdk": "^3.1.0",
    "chart.js": "^4.3.3",
    "chartjs-adapter-date-fns": "^3.0.0",
    "clsx": "^2.0.0",
    "cva": "npm:class-variance-authority@^0.6.1",
    "date-fns": "^2.30.0",
    "eth-chains": "^2.0.0",
    "ethers": "^6.7.1",
    "flat-cache": "^4.0.0",
    "graphql-request": "^6.1.0",
    "graphql-tag": "^2.12.6",
    "gsap": "^3.12.4",
    "solid-chartjs": "^1.3.8",
    "solid-icons": "^1.0.11",
    "solid-js": "^1.8.5",
    "solid-start": "^0.3.10",
    "solid-toast": "^0.5.0",
    "swiper": "^10.3.1",
    "tailwind-merge": "^1.13.2",
    "undici": "^5.22.1",
    "vite-plugin-solid": "^2.7.2",
    "zod": "^3.21.4"
  },
  "devDependencies": {
    "@antfu/eslint-config": "^0.39.4",
    "@faker-js/faker": "^8.0.2",
    "@iconify-json/mdi": "^1.1.52",
    "@playwright/test": "^1.37.1",
    "@solidjs/testing-library": "^0.8.3",
    "@types/flat-cache": "^2.0.2",
    "@types/node": "^20.2.5",
    "@typescript-eslint/parser": "^5.59.8",
    "@vitest/ui": "^0.32.2",
    "eslint": "^8.41.0",
    "eslint-plugin-jsx-a11y": "^6.7.1",
    "eslint-plugin-solid": "^0.12.1",
    "eslint-plugin-storybook": "^0.6.13",
    "eslint-plugin-tailwindcss": "^3.12.1",
    "eslint-plugin-unicorn": "^47.0.0",
    "jsdom": "^22.1.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "solid-start-node": "^0.3.10",
    "typescript": "^5.0.4",
    "unocss": "^0.53.4",
    "vite": "^4.4.9",
    "vite-plugin-solid-svg": "^0.6.4",
    "vite-tsconfig-paths": "^4.2.1",
    "vitest": "^0.31.3"
  },
  "pnpm": {},
  "resolutions": {
    "vite-plugin-inspect": "0.7.38"
  }

yeah planning to migrate thank you @bigmistqke i have posted the list of the packages I am using please check it

Birk Skyum•10mo ago

Can you try installing "@solidjs/router": "0.9.1" with resolutions in package.json

bigmistqke•10mo ago

oops sorry forgot to reply. but what Birk says is correct: you should install @solidjs/router version that is compatible with this older, pre beta 2 version of solid-start.

Yisacc - Full Stack DevOP•10mo ago

Yisacc - Full Stack DevOP•10mo ago

I already tried that but i faced this error

Yisacc - Full Stack DevOP•10mo ago

solid start 0.3.10 is latest version actually i think you are referring solidjs @bigmistqke @Birk Skyum

Birk Skyum•10mo ago

https://www.npmjs.com/package/@solidjs/start

npm

@solidjs/start

This is the SolidStart framework and CLI.. Latest version: 0.7.7, last published: 18 hours ago. Start using @solidjs/start in your project by running npm i @solidjs/start. There is 1 other project in the npm registry using @solidjs/start.

Yisacc - Full Stack DevOP•10mo ago

oops I see

bigmistqke•10mo ago

Ye it's a bit confusing, I agree. I mentioned this in https://discord.com/channels/722131463138705510/861229287868858379/1219336383764893776

Yisacc - Full Stack DevOP•10mo ago

yeah it is

bigmistqke•10mo ago

It happened when we went to solid start beta V2 if I m not mistaken

Yisacc - Full Stack DevOP•10mo ago

oh okay does it have a documentation on what's been changed I have seen the solid start beta v2 documentation

bigmistqke•10mo ago

https://github.com/solidjs/solid-start/discussions/1052 is the announcement

GitHub

SolidStart Beta 2 · solidjs solid-start · Discussion #1052

There has been a lot of anticipation about when SolidStart can get out of Beta and move to 1.0. But unfortunately we are not ready yet. I think that is clear from the nature of bugs and issues we a...

bigmistqke•10mo ago

But some things might have changed from that moment on Beta V2 was quite a big change, a rebase on nitro and a new router. This version will be much closer to the API when it comes out of beta.

Yisacc - Full Stack DevOP•10mo ago

yeah but am working on a prod app it will be difficult for me to migrate it just to add a test for one module

Birk Skyum•10mo ago

Here is a working example of the new solid-start: https://stackblitz.com/github/solidjs/solid-start/tree/main/examples/basic What you want to pay attention to is the vite.config.ts -> app.config.ts, where now the vite settings are moved within a vite property { vite: {} } Also, the entry-server, entry-client changed, and the router api changed, so where it before was:

      <Router>
         <SomeProvider>
            <A href"Here">Test</A>

            <Routes>
              <Route
                path={['/:user/:repl', '/scratchpad']}
                element={<Edit />}
              />
              <Route path="/:user" element={<Home />} />
              <Route path="/" element={<Home />} />
              <Route path="/login" element={<Login />} />
            </Routes>
         </SomeProvider>
      <Router>

      <Router>
         <SomeProvider>
            <A href"Here">Test</A>

            <Routes>
              <Route
                path={['/:user/:repl', '/scratchpad']}
                element={<Edit />}
              />
              <Route path="/:user" element={<Home />} />
              <Route path="/" element={<Home />} />
              <Route path="/login" element={<Login />} />
            </Routes>
         </SomeProvider>
      <Router>

      <Router root={(props)=>(
         <SomeProvider>
          <A href"Here">Test</A>
          <Suspense>{props.children}</Suspense>
         </SomeProvider>
      )}>
        <Route
          path={['/:user/:repl', '/scratchpad']}
          component={Edit}
        />
        <Route path="/:user" component={Home} />
        <Route path="/" component={Home} />
        <Route path="/login" component={Login} />
      </Router>

      <Router root={(props)=>(
         <SomeProvider>
          <A href"Here">Test</A>
          <Suspense>{props.children}</Suspense>
         </SomeProvider>
      )}>
        <Route
          path={['/:user/:repl', '/scratchpad']}
          component={Edit}
        />
        <Route path="/:user" component={Home} />
        <Route path="/" component={Home} />
        <Route path="/login" component={Login} />
      </Router>

@Yisacc - Full Stack Dev , I understand the frustration, but there are not being made patch releases to the version you're on currently if something is off. I can help you with this though: https://discord.com/channels/722131463138705510/1219260239900053534/1219799164758528001 Does there error say more about where it breaks? It's typically because of useSearchParams, or A used outside the pages.

Yisacc - Full Stack DevOP•10mo ago

import { Environment } from "@axelar-network/axelarjs-sdk";
import { beforeEach, describe, expect, it } from "vitest";

import Axelar from "./axelar";

describe("Axelar", () => {
  let axelar: Axelar;

  beforeEach(() => {
    axelar = new Axelar();
  });

  it("should initialize with the correct environment", () => {
    expect(axelar.getAxelarQuery().environment).toEqual(
      process.env.NODE_ENV === "production" ? Environment.MAINNET : Environment.TESTNET,
    );
  });
});

import { Environment } from "@axelar-network/axelarjs-sdk";
import { beforeEach, describe, expect, it } from "vitest";

import Axelar from "./axelar";

describe("Axelar", () => {
  let axelar: Axelar;

  beforeEach(() => {
    axelar = new Axelar();
  });

  it("should initialize with the correct environment", () => {
    expect(axelar.getAxelarQuery().environment).toEqual(
      process.env.NODE_ENV === "production" ? Environment.MAINNET : Environment.TESTNET,
    );
  });
});

here is the test

import type { SendTokenParams } from "@axelar-network/axelarjs-sdk";
import { AxelarAssetTransfer, AxelarQueryAPI, Environment } from "@axelar-network/axelarjs-sdk";
import { ethers, Wallet } from "ethers";
import { type Accessor, createResource } from "solid-js";
import { isServer } from "solid-js/web";
import type { ContractOptions } from "~/contracts/types";
import { useContractOptions } from "~/providers/contract-options-provider";
import type { OnboardActions } from "~/providers/onboard-provider";
import { useWeb3Onboard } from "~/providers/onboard-provider/context";
import { createResourceWrapper, type ResourceCache, type ResourceWrapper } from "~/util/resource";

import type { SendTokenParams } from "@axelar-network/axelarjs-sdk";
import { AxelarAssetTransfer, AxelarQueryAPI, Environment } from "@axelar-network/axelarjs-sdk";
import { ethers, Wallet } from "ethers";
import { type Accessor, createResource } from "solid-js";
import { isServer } from "solid-js/web";
import type { ContractOptions } from "~/contracts/types";
import { useContractOptions } from "~/providers/contract-options-provider";
import type { OnboardActions } from "~/providers/onboard-provider";
import { useWeb3Onboard } from "~/providers/onboard-provider/context";
import { createResourceWrapper, type ResourceCache, type ResourceWrapper } from "~/util/resource";

and the above is the import inside the axelar file Thank You we are planning to migrate the resource you provided is very helpful

Birk Skyum•10mo ago

You're welcome. I migrated a small app today from @solidjs/router migration from 0.8.x -> 0.13.x (not using start), and I had to debug the same error as you, and found I needed to move the useSearchParams inside a Route: https://github.com/solidjs/solid-playground/pull/165/commits/3004d1d0f0e0b11a3ec66a96a8e80bb0de6cb3ab

Yisacc - Full Stack DevOP•10mo ago

i see great do you know if we have redirect and renderStream in the updated version

Birk Skyum•10mo ago

There is renderToStream in solid-js core https://docs.solidjs.com/reference/rendering/render-to-stream For the redirect, there is the useNavigate in the router https://docs.solidjs.com/solid-router/reference/primitives/use-navigate

Gaming

Programming

Cannot find module

Did you find this page helpful?