crxjs / chrome-extension-tools

Bundling Chrome Extensions can be pretty complex. It doesn't have to be.
https://crxjs.dev/vite-plugin
2.71k stars 181 forks source link

It is not possible to build a plugin on Windows #473

Open GoodSimonVM opened 2 years ago

GoodSimonVM commented 2 years ago

Describe the problem

Description: I want to help develop chrome-extension-tools, but it's a bit difficult to get started. I made a fork, downloaded the repository to my computer and installed the packages using "pnpm i". Then I go to "chrome-extension-tools/packages/vite-plugin" and try to build using "pnpm run build", but I get an error message (see output 1).

Do you see this strange paths? (Projects/GitHub/chrome-extension-tools/packages/vite-plugin/D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin/src/client/html/precont roller.html?client) I think it's because you use import { posix as path } from "path" in your tscripts. I changed this to import path from "path", and it got better, but it still doesn't work. Now I get an error message (see output 2).

As you can see, Rolap cannot resolve /hmr-content-part.ts?client as esm and ask me to change the output format.

Outputs: Output 1:

PS D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin> pnpm run build

> @crxjs/vite-plugin@1.0.14 build D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin
> run-s build:clean build:js

> @crxjs/vite-plugin@1.0.14 build:clean D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin
> rimraf dist

> @crxjs/vite-plugin@1.0.14 build:js D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin
> rollup -c rollup.config.ts --configPlugin esbuild

src/node/index.ts → dist/index.mjs, dist/index.cjs...
[!] (plugin bundleClientCode) Error: Could not load /Projects/GitHub/chrome-extension-tools/packages/vite-plugin/D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin/src/client/html/precont
roller.html?client (imported by src/node/plugin-fileWriter--pages.ts): ENOENT: no such file or directory, open 'D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin\D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin\src\client\html\precontroller.html'                                                                                                                             Error: Could not load /Projects/GitHub/chrome-extension-tools/packages/vite-plugin/D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin/src/client/html/precontroller.html?client (imported b
y src/node/plugin-fileWriter--pages.ts): ENOENT: no such file or directory, open 'D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin\D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin\src\client\html\precontroller.html'                                                                                                                                                           
 ELIFECYCLE  Command failed with exit code 1.
ERROR: "build:js" exited with 1.
 ELIFECYCLE  Command failed with exit code 1.

Output 2:

PS D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin> pnpm run build

> @crxjs/vite-plugin@1.0.14 build D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin
> run-s build:clean build:js

> @crxjs/vite-plugin@1.0.14 build:clean D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin
> rimraf dist

> @crxjs/vite-plugin@1.0.14 build:js D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin
> rollup -c rollup.config.ts --configPlugin esbuild

src/node/index.ts → dist/index.mjs, dist/index.cjs...
[!] (plugin bundleClientCode) Error: Could not load D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin\src\client\es/hmr-content-port.ts?client (imported by src/node/plugin-content-script
s.ts): You must specify "output.format", which can be one of "amd", "cjs", "system", "es", "iife" or "umd".                                                                                            https://rollupjs.org/guide/en/#outputformat
Error: Could not load D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin\src\client\es/hmr-content-port.ts?client (imported by src/node/plugin-content-scripts.ts): You must specify "outpu
t.format", which can be one of "amd", "cjs", "system", "es", "iife" or "umd".                                                                                                                              at error (D:\Projects\GitHub\chrome-extension-tools\node_modules\.pnpm\rollup@2.72.1\node_modules\rollup\dist\shared\rollup.js:198:30)
    at getFormat (D:\Projects\GitHub\chrome-extension-tools\node_modules\.pnpm\rollup@2.72.1\node_modules\rollup\dist\shared\rollup.js:23422:20)
    at normalizeOutputOptions (D:\Projects\GitHub\chrome-extension-tools\node_modules\.pnpm\rollup@2.72.1\node_modules\rollup\dist\shared\rollup.js:23335:20)
    at getOutputOptions (D:\Projects\GitHub\chrome-extension-tools\node_modules\.pnpm\rollup@2.72.1\node_modules\rollup\dist\shared\rollup.js:23717:12)
    at getOutputOptionsAndPluginDriver (D:\Projects\GitHub\chrome-extension-tools\node_modules\.pnpm\rollup@2.72.1\node_modules\rollup\dist\shared\rollup.js:23712:12)
    at handleGenerateWrite (D:\Projects\GitHub\chrome-extension-tools\node_modules\.pnpm\rollup@2.72.1\node_modules\rollup\dist\shared\rollup.js:23687:74)
    at Object.generate (D:\Projects\GitHub\chrome-extension-tools\node_modules\.pnpm\rollup@2.72.1\node_modules\rollup\dist\shared\rollup.js:23649:20)
    at Object.load (D:\Projects\GitHub\chrome-extension-tools\packages\vite-plugin\rollup.config.ts:69:42)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at D:\Projects\GitHub\chrome-extension-tools\node_modules\.pnpm\rollup@2.72.1\node_modules\rollup\dist\shared\rollup.js:22235:83

 ELIFECYCLE  Command failed with exit code 1.
ERROR: "build:js" exited with 1.
 ELIFECYCLE  Command failed with exit code 1.

System Info:

System:
  OS: Windows 10 10.0.19042
  CPU: (12) x64 Intel(R) Core(TM) i5-10500 CPU @ 3.10GHz
  Memory: 5.04 GB / 15.86 GB
Binaries:
  Node: 16.15.1 - D:\Programs\nodejs\node.EXE
  npm: 8.16.0 - ~\AppData\Roaming\npm\npm.CMD
Browsers:
  Edge: Spartan (44.19041.423.0), Chromium (104.0.1293.54)
  Internet Explorer: 11.0.19041.1
npmPackages:
  rollup: ^2.70.2 => 2.72.1
  vite: ^2.9.5 => 2.9.9

Describe the proposed solution

I would like your code to be able to be compiled under windows.

Alternatives considered

I think you could add a detailed description of the system for building your project so that those who want to help can set up a virtual machine.

Importance

nice to have

linonetwo commented 7 months ago

import { posix } from 'path'; causes this.

@lionelhorn seems you already fix this, can you PR or release a version?

myfunc commented 5 months ago

Hi! Following up on the issue.