Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Errors when running yarn install #150

Closed
swissspidy opened this issue Mar 16, 2023 · 3 comments
Closed

Errors when running yarn install #150

swissspidy opened this issue Mar 16, 2023 · 3 comments

Comments

@swissspidy
Copy link
Member

I wanted to familiarize myself with the code base, but already struggle at the yarn run build step.

src/web/service-worker/index.ts, src/web.ts → build/web...
(!) Plugin typescript: @rollup/plugin-typescript TS2792: Cannot find module 'comlink'. Did you mean to set the 'moduleResolution' option to 'nodenext', or to add aliases to the 'paths' option?
src/php-library/comlink-utils.ts: (1:21)

1 import Comlink from 'comlink';
                      ~~~~~~~~~

src/web/register-service-worker.ts: (1:29)

1 import type { Remote } from "comlink";
                              ~~~~~~~~~

(!) Plugin typescript: @rollup/plugin-typescript TS5097: An import path can only end with a '.ts' extension when 'allowImportingTsExtensions' is enabled.
src/web.ts: (1:15)

1 export * from './php-library/index.ts';
                ~~~~~~~~~~~~~~~~~~~~~~~~

src/web.ts: (2:15)

2 export * from './web/index.ts';
                ~~~~~~~~~~~~~~~~

(!) Unresolved dependencies
https://rollupjs.org/troubleshooting/#warning-treating-module-as-external-dependency
comlink (imported by "src/php-library/comlink-utils.ts")
created build/web in 1.5s

src/node.ts → build/node...
(!) Plugin typescript: @rollup/plugin-typescript TS2792: Cannot find module 'comlink'. Did you mean to set the 'moduleResolution' option to 'nodenext', or to add aliases to the 'paths' option?
src/php-library/comlink-utils.ts: (1:21)

1 import Comlink from 'comlink';
                      ~~~~~~~~~

src/web/register-service-worker.ts: (1:29)

1 import type { Remote } from "comlink";
                              ~~~~~~~~~

(!) Plugin typescript: @rollup/plugin-typescript TS5097: An import path can only end with a '.ts' extension when 'allowImportingTsExtensions' is enabled.
src/web.ts: (1:15)

1 export * from './php-library/index.ts';
                ~~~~~~~~~~~~~~~~~~~~~~~~

src/web.ts: (2:15)

2 export * from './web/index.ts';
                ~~~~~~~~~~~~~~~~

created build/node in 1.3s

  build/index.js          10.9kb
  build/php-SQD4XQQA.ini   322b 

⚡ Done in 10ms

src/index.ts → build/...
(node:76064) ExperimentalWarning: Importing JSON modules is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
(!) Unresolved dependencies
https://rollupjs.org/troubleshooting/#warning-treating-module-as-external-dependency
@wordpress/php-wasm (imported by "src/index.ts")
created build/ in 483ms

  build/tsdoc-to-api-markdown.js  8.5mb ⚠️

⚡ Done in 261ms
vite v4.1.4 building for production...
transforming...
✓ 31 modules transformed.
rendering chunks...
computing gzip size...
build/index.js  58.83 kB │ gzip: 15.90 kB
[vite-plugin-static-copy] Copied 2 items.
vite v4.1.4 building for production...
transforming...
✓ 2 modules transformed.
rendering chunks...
computing gzip size...
build/setup-react-refresh-runtime.js  6.27 kB │ gzip: 2.53 kB
vite v4.1.4 building for production...
transforming...

new URL("/", import.meta.url) doesn't exist at build time, it will remain unchanged to be resolved at runtime
✓ 133 modules transformed.
[vite-plugin-static-copy] Copy count was not set.
[vite:worker] "default" is not exported by "../../node_modules/comlink/dist/esm/comlink.mjs", imported by "../php-wasm/src/php-library/comlink-utils.ts".
file: /path/to/wordpress-playground/packages/wordpress-playground/src/worker-thread.ts?worker&url:1:7
1: import Comlink from 'comlink';
          ^
2: 
3: export function consumeAPI<APIType>(remote: Worker | Window) {
error during build:
RollupError: "default" is not exported by "../../node_modules/comlink/dist/esm/comlink.mjs", imported by "../php-wasm/src/php-library/comlink-utils.ts".
    at error (file:///path/to/wordpress-playground/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:2105:30)
    at Module.error (file:///path/to/wordpress-playground/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:13174:16)
    at Module.traceVariable (file:///path/to/wordpress-playground/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:13559:29)
    at ModuleScope.findVariable (file:///path/to/wordpress-playground/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:12061:39)
    at FunctionScope.findVariable (file:///path/to/wordpress-playground/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:6836:38)
    at ChildScope.findVariable (file:///path/to/wordpress-playground/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:6836:38)
    at MemberExpression.bind (file:///path/to/wordpress-playground/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:9129:49)
    at CallExpression.bind (file:///path/to/wordpress-playground/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:5726:23)
    at CallExpression.bind (file:///path/to/wordpress-playground/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:9470:15)
    at ConditionalExpression.bind (file:///path/to/wordpress-playground/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:5726:23)
ERROR: "build:js" exited with 1.
The command failed for workspaces that are depended upon by other workspaces; can't satisfy the dependency graph
Failed with errors in 10s 724ms

Using yarn 3.4.1 and Node 18.13.0

@swissspidy
Copy link
Member Author

Also, the lock file gets updated when running install:

@ yarn.lock:3931 @ __metadata:
  languageName: unknown
  linkType: soft

-"@wordpress/playground@^0.1.4, @wordpress/playground@workspace:packages/playground":
+"@wordpress/playground@^0.1.4, @wordpress/playground@workspace:packages/wordpress-playground":
   version: 0.0.0-use.local
-  resolution: "@wordpress/playground@workspace:packages/playground"
+  resolution: "@wordpress/playground@workspace:packages/wordpress-playground"
   dependencies:
     "@types/node": 12.20.24
     "@wordpress/php-wasm": 0.0.1

@adamziel
Copy link
Collaborator

@swissspidy thank you for reporting! A fix is coming together in #151

adamziel added a commit that referenced this issue Mar 16, 2023
## Description

Sets up the correct build pipeline for all parts of Playground and PHP.wasm. This enables a public release of the [Playground API](#149) npm package!

I've been [struggling](#146) with [this](#70) for [a while](#150) and couldn't understand what's so hard. NX made it apparent – look at this dependency graph!

<img width="1291" alt="CleanShot 2023-03-16 at 23 16 26@2x" src="https://user-images.githubusercontent.com/205419/225764795-7fa8e972-09f8-41ef-aac2-1c96bd100ea0.png">

No wonder it's been almost impossible to set everything up by hand!

## Usage

Start with `yarn install`

### Shortcuts

To start a copy of `wasm.wordpress.net` locally, run `yarn run dev`.
To build it, run `yarn run build`.

### Fully qualified commands

In reality, these `yarn run` commands are just triggering the underlying project's nx `dev` and `build` commands:

```bash
nx dev playground-website
nx build playground-website
```

Here's a few more interesting commands:

```bash
# Build and run PHP.wasm CLI
nx start php-wasm-cli

# Build latest WordPress releases
nx recompile-wordpress:all playground-remote

# Recompile PHP 5.6 - 8.2 releases to .wasm for web
nx recompile-php:all php-wasm-web

# Recompile PHP 5.6 - 8.2 releases to .wasm for node
nx recompile-php:all php-wasm-node

# Builds markdown files for readthedocs site
nx build docs-site

# Builds the Playground Client npm package
nx build playground-client
```

## NX is the tool Playground needed from the outset

It's ridiculous how many problems this solves:

* The build pipeline is explicitly defined and easy to modify
* Tasks only run once their dependencies are ready
* The dev mode works and is fast
* The build works and is fast
* We get CI checks to confirm the entire build process still works (which solves #150)
* Cross-package TypeScript just works
* There are linters and formatters (which solves #14)
* Documentation is correctly generated from the latest built artifacts
* There are nice generators for bootstraping new packages and moving the existing ones around
* There are checks to ensure the private `php-wasm-common` package is not imported by anything else than `php-wasm-web` and `php-wasm-node`

## Next steps

* Add Lerna to harness package publishing
* Additional developer documentation for the nx-based flow

Related to #148 and #147
@adamziel
Copy link
Collaborator

adamziel commented Mar 16, 2023

Fixed in #151 – this new repo structure will stay for the foreseeable future and the build should work reliably thanks to the CI integration.

Pookie717 added a commit to Pookie717/wordpress-playground that referenced this issue Oct 1, 2023
## Description

Sets up the correct build pipeline for all parts of Playground and PHP.wasm. This enables a public release of the [Playground API](WordPress/wordpress-playground#149) npm package!

I've been [struggling](WordPress/wordpress-playground#146) with [this](WordPress/wordpress-playground#70) for [a while](WordPress/wordpress-playground#150) and couldn't understand what's so hard. NX made it apparent – look at this dependency graph!

<img width="1291" alt="CleanShot 2023-03-16 at 23 16 26@2x" src="https://user-images.githubusercontent.com/205419/225764795-7fa8e972-09f8-41ef-aac2-1c96bd100ea0.png">

No wonder it's been almost impossible to set everything up by hand!

## Usage

Start with `yarn install`

### Shortcuts

To start a copy of `wasm.wordpress.net` locally, run `yarn run dev`.
To build it, run `yarn run build`.

### Fully qualified commands

In reality, these `yarn run` commands are just triggering the underlying project's nx `dev` and `build` commands:

```bash
nx dev playground-website
nx build playground-website
```

Here's a few more interesting commands:

```bash
# Build and run PHP.wasm CLI
nx start php-wasm-cli

# Build latest WordPress releases
nx recompile-wordpress:all playground-remote

# Recompile PHP 5.6 - 8.2 releases to .wasm for web
nx recompile-php:all php-wasm-web

# Recompile PHP 5.6 - 8.2 releases to .wasm for node
nx recompile-php:all php-wasm-node

# Builds markdown files for readthedocs site
nx build docs-site

# Builds the Playground Client npm package
nx build playground-client
```

## NX is the tool Playground needed from the outset

It's ridiculous how many problems this solves:

* The build pipeline is explicitly defined and easy to modify
* Tasks only run once their dependencies are ready
* The dev mode works and is fast
* The build works and is fast
* We get CI checks to confirm the entire build process still works (which solves #150)
* Cross-package TypeScript just works
* There are linters and formatters (which solves #14)
* Documentation is correctly generated from the latest built artifacts
* There are nice generators for bootstraping new packages and moving the existing ones around
* There are checks to ensure the private `php-wasm-common` package is not imported by anything else than `php-wasm-web` and `php-wasm-node`

## Next steps

* Add Lerna to harness package publishing
* Additional developer documentation for the nx-based flow

Related to WordPress/wordpress-playground#148 and WordPress/wordpress-playground#147
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants