thetarnav / solid-devtools

Library of developer tools, reactivity debugger & Devtools Chrome extension for visualizing SolidJS reactivity graph
https://chrome.google.com/webstore/detail/solid-devtools/kmcfjchnmmaeeagadbhoofajiopoceel
MIT License
538 stars 21 forks source link

Solid application does not build when devtools plugin added to vite plugins config #247

Closed mslawins closed 1 year ago

mslawins commented 1 year ago

I wanted to experiment a bit with solid-devtools. Unfortunately I couldn't make it to work with my application. I tried to integrate devtools into newly created project. Both tries failed in the same way. Here is the output from pnpm run start command:

mslawins@macbook ~/temp/my-app $ pnpm run start

> vite-template-solid@0.0.0 start /Users/mslawins/temp/my-app
> vite

✘ [ERROR] No known conditions for "./vite" specifier in "solid-devtools" package [plugin externalize-deps]

    node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:1360:27:
      1360 │         let result = await callback({
           ╵                            ^

    at e (file:///Users/mslawins/temp/my-app/node_modules/.pnpm/vite@4.3.9/node_modules/vite/dist/node/chunks/dep-e8f070e8.js:16647:25)
    at n (file:///Users/mslawins/temp/my-app/node_modules/.pnpm/vite@4.3.9/node_modules/vite/dist/node/chunks/dep-e8f070e8.js:16647:646)
    at o (file:///Users/mslawins/temp/my-app/node_modules/.pnpm/vite@4.3.9/node_modules/vite/dist/node/chunks/dep-e8f070e8.js:16647:1297)
    at resolveExportsOrImports (file:///Users/mslawins/temp/my-app/node_modules/.pnpm/vite@4.3.9/node_modules/vite/dist/node/chunks/dep-e8f070e8.js:23405:20)
    at resolveDeepImport (file:///Users/mslawins/temp/my-app/node_modules/.pnpm/vite@4.3.9/node_modules/vite/dist/node/chunks/dep-e8f070e8.js:23424:31)
    at tryNodeResolve (file:///Users/mslawins/temp/my-app/node_modules/.pnpm/vite@4.3.9/node_modules/vite/dist/node/chunks/dep-e8f070e8.js:23113:20)
    at file:///Users/mslawins/temp/my-app/node_modules/.pnpm/vite@4.3.9/node_modules/vite/dist/node/chunks/dep-e8f070e8.js:64459:40
    at requestCallbacks.on-resolve (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:1360:28)
    at handleRequest (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:723:19)
    at handleIncomingPacket (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:745:7)

  This error came from the "onResolve" callback registered here:

    node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:1279:20:
      1279 │       let promise = setup({
           ╵                     ^

    at setup (file:///Users/mslawins/temp/my-app/node_modules/.pnpm/vite@4.3.9/node_modules/vite/dist/node/chunks/dep-e8f070e8.js:64448:27)
    at handlePlugins (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:1279:21)
    at buildOrContextImpl (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:968:5)
    at Object.buildOrContext (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:776:5)
    at /Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:2163:15
    at new Promise (<anonymous>)
    at Object.build (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:2162:25)
    at build (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:2011:51)
    at bundleConfigFile (file:///Users/mslawins/temp/my-app/node_modules/.pnpm/vite@4.3.9/node_modules/vite/dist/node/chunks/dep-e8f070e8.js:64411:26)

  The plugin "externalize-deps" was triggered by this import

    vite.config.ts:3:21:
      3 │ import devtools from "solid-devtools/vite";
        ╵                      ~~~~~~~~~~~~~~~~~~~~~

failed to load config from /Users/mslawins/temp/my-app/vite.config.ts
error when starting dev server:
Error: Build failed with 1 error:
node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:1360:27: ERROR: [plugin: externalize-deps] No known conditions for "./vite" specifier in "solid-devtools" package
    at failureErrorWithLog (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:1636:15)
    at /Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:1048:25
    at runOnEndCallbacks (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:1471:45)
    at buildResponseToResult (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:1046:7)
    at /Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:1075:16
    at responseCallbacks.<computed> (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:697:9)
    at handleIncomingPacket (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:752:9)
    at Socket.readFromStdout (/Users/mslawins/temp/my-app/node_modules/.pnpm/esbuild@0.17.19/node_modules/esbuild/lib/main.js:673:7)
    at Socket.emit (node:events:513:28)
    at addChunk (node:internal/streams/readable:324:12)
 ELIFECYCLE  Command failed with exit code 1.
mslawins@macbook ~/temp/my-app $

I tried two package.json versions. One from solidjs/templates/ts and second one after bumping all packages from template to the newest versions:

{
  "name": "vite-template-solid",
  "version": "0.0.0",
  "description": "",
  "scripts": {
    "start": "vite",
    "dev": "vite",
    "build": "vite build",
    "serve": "vite preview"
  },
  "license": "MIT",
  "devDependencies": {
    "solid-devtools": "^0.27.3",
    "typescript": "^5.1.3",
    "vite": "^4.3.9",
    "vite-plugin-solid": "^2.7.0"
  },
  "dependencies": {
    "solid-js": "^1.7.6"
  }
}

Here is vite.config.ts

import { defineConfig } from "vite";
import solid from "vite-plugin-solid"; // or solid-start/vite
import devtools from "solid-devtools/vite";

export default defineConfig({
  plugins: [
    devtools({
      /* features options - all disabled by default */
      autoname: true, // e.g. enable autoname
    }),
    solid(),
  ],
});

Did I misunderstood configuration steps or is this a plugin problem? I couldn't debug this on my own. If problem in on my side of things please point me in the right direction. Thank you.

thetarnav commented 1 year ago

Could you try adding "type": "module" to package.json?

mslawins commented 1 year ago

Adding "type": "module" to package.json fixed my problem in both repositories. Thanks, much appreciated.