The right tab is the redwood repo, the left is the redwoodblog app created by following the tutorial.
It seems that when I run yarn build:watch - it ends up in an infinite build loop. If I force quit it and start again, it’s ok - but then then trying to run the app, with yarn rwt copy:watch ../redwood, it fails with these errors:
Note: The path to redwood specified above is where my redwood repo is locally.
➜ redwoodblog git:(master) ✗ yarn rw dev web
yarn run v1.22.4
$ /Users/alvincrespo/redwoodblog/node_modules/.bin/rw dev web
$ /Users/alvincrespo/redwoodblog/node_modules/.bin/webpack-dev-server --config ../node_modules/@redwoodjs/core/config/webpack.development.js
web | internal/modules/cjs/loader.js:797
web | throw err;
web | ^
web |
web | Error: Cannot find module 'webpack-retry-chunk-load-plugin'
web | Require stack:
web | - /Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/core/config/webpack.common.js
web | - /Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/core/config/webpack.development.js
web | - /Users/alvincrespo/redwoodblog/node_modules/webpack-cli/bin/utils/convert-argv.js
web | - /Users/alvincrespo/redwoodblog/node_modules/webpack-dev-server/bin/webpack-dev-server.js
web | at Function.Module._resolveFilename (internal/modules/cjs/loader.js:794:15)
web | at Function.Module._load (internal/modules/cjs/loader.js:687:27)
web | at Module.require (internal/modules/cjs/loader.js:849:19)
web | at require (internal/modules/cjs/helpers.js:74:18)
web | at Object.<anonymous> (/Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/core/config/webpack.common.js:10:34)
web | at Module._compile (internal/modules/cjs/loader.js:956:30)
web | at Object.Module._extensions..js (internal/modules/cjs/loader.js:973:10)
web | at Module.load (internal/modules/cjs/loader.js:812:32)
web | at Function.Module._load (internal/modules/cjs/loader.js:724:14)
web | at Module.require (internal/modules/cjs/loader.js:849:19)
web | at require (internal/modules/cjs/helpers.js:74:18)
web | at Object.<anonymous> (/Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/core/config/webpack.development.js:6:23)
web | at Module._compile (internal/modules/cjs/loader.js:956:30)
web | at Object.Module._extensions..js (internal/modules/cjs/loader.js:973:10)
web | at Module.load (internal/modules/cjs/loader.js:812:32)
web | at Function.Module._load (internal/modules/cjs/loader.js:724:14) {
web | code: 'MODULE_NOT_FOUND',
web | requireStack: [
web | '/Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/core/config/webpack.common.js',
web | '/Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/core/config/webpack.development.js',
web | '/Users/alvincrespo/redwoodblog/node_modules/webpack-cli/bin/utils/convert-argv.js',
web | '/Users/alvincrespo/redwoodblog/node_modules/webpack-dev-server/bin/webpack-dev-server.js'
web | ]
web | }
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
web | cd "/Users/alvincrespo/redwoodblog/web" && yarn webpack-dev-server --config ../node_modules/@redwoodjs/core/config/webpack.development.js exited with code 1
✨ Done in 3.49s.
and
➜ redwoodblog git:(master) ✗ yarn rw dev api
yarn run v1.22.4
$ /Users/alvincrespo/redwoodblog/node_modules/.bin/rw dev api
$ /Users/alvincrespo/redwoodblog/node_modules/.bin/dev-server
api | Running at 'http://localhost:8911'
api | Watching files in '/Users/alvincrespo/redwoodblog/api/src/functions'
api |
api | Error: Cannot find module 'graphql-scalars'
api | Require stack:
api | - /Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/api/dist/makeMergedSchema/rootSchema.js
api | - /Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/api/dist/makeMergedSchema/makeMergedSchema.js
api | - /Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/api/dist/index.js
api | - /Users/alvincrespo/redwoodblog/api/src/functions/graphql.js
api | - /Users/alvincrespo/redwoodblog/node_modules/require-dir/index.js
api | - /Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/dev-server/dist/watchApiSide.js
api | - /Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/dev-server/dist/main.js
api |
api |
api | 1 anonymous
api | /Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/api/dist/makeMergedSchema/rootSchema.js:15
api |
api | 2 Module._compile
api | /Users/alvincrespo/redwoodblog/node_modules/pirates/lib/index.js:99
api |
api | 3 Object.newLoader [as .js]
api | /Users/alvincrespo/redwoodblog/node_modules/pirates/lib/index.js:104
api |
I have run into this issue as well building redwood and then copying into my local app … I have been meaning to ask others (like @peterp) so thanks for raising this up.
I work around it by adding devDependencies to the root rw package.json:
@dthyresson Awesome! I never knew you could do that. I’ll add that to CONTRIBUTING.md.
@alvincrespo I recently ran into this issue as well. I think this is what redwood-tool's lesser-known command, install is for.
CONTRIBUTING.md needs updating now that I know how it actually works, but if you run into an issue like this, where, after running yarn rwt copy, your Redwood app is missing packages, the way to fix it is by:
Identifying the redwoodjs package that lists the dependency (using your output, the webpack-retry-chunk-load-plugin package points to redwoodjs/core):
web | Error: Cannot find module 'webpack-retry-chunk-load-plugin'
web | Require stack:
web | - /Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/core/config/webpack.common.js
Publishing this package (redwoodjs/core) to your local npm emulator by 1) starting your local npm emulator (in your copy of the redwood/redwood repo) and 2) publishing redwoodjs/core to it:
# start your local npm emulator
redwood$ ./tasks/run-local-npm
...
# in a separate terminal, publish @redwoodjs/core to it
redwood$ ./tasks/publish-local packages/core
In your Redwood app, use yarn rwt install to install the redwoodjs/core package you just published:
redwood-app$ yarn rwt install @redwoodjs/core
Now you can use the more-convenient yarn rwt copy command to copy over your ensuing changes (that don’t involve dependency modifications):
redwood-app$ yarn rwt copy
# make changes in redwood/redwood
# ...
redwood-app$ yarn rwt copy
# make more changes in redwood/redwood
# ...
redwood-app$ yarn rwt copy
You might have to do the same thing for redwoodjs/api, but let me know if that works for you!
I had to do something similar earlier today myself. It was just for testing, so I did yarn add -W package-name in my RW app, after running rwt copy. I don’t have a local npm emulator, and didn’t feel like setting one up. @dom what’s the benefit of Verdaccio compared to just doing what I did (and what @dthyresson also did/does)
@Tobbe Great question, and the short answer is I don’t know.
If there isn’t a difference, what you and @dthyresson do seems easier to me. But I think the upshot is: if you’re changing a redwoodjs package so that it has a new dependency, you should use yarn rwt install since it’s “more true” to what would happen in yarn create redwood-app once it ships–the dependency being specified in the package.json of the redwoodjs package and all that.
But in the case that you’re not adding a new dependency and just trying to get the build working, I’m not so sure that it’s important to use yarn rwt install, as long as you get the version of the dependency right.
➜ redwoodblog git:(master) ✗ yarn rw dev
yarn run v1.22.4
$ /Users/alvincrespo/redwoodblog/node_modules/.bin/rw dev
$ /Users/alvincrespo/redwoodblog/node_modules/.bin/dev-server
$ /Users/alvincrespo/redwoodblog/node_modules/.bin/webpack-dev-server --config ../node_modules/@redwoodjs/core/config/webpack.development.js
api | Running at 'http://localhost:8911'
api | Watching files in '/Users/alvincrespo/redwoodblog/api/src/functions'
web | ℹ ｢wds｣: Project is running at http://localhost:8910/
web | ℹ ｢wds｣: webpack output is served from /
web | ℹ ｢wds｣: Content not from webpack is served from /Users/alvincrespo/redwoodblog/web
web | ℹ ｢wds｣: 404s will fallback to /index.html
api |
api | TypeError: /Users/alvincrespo/redwoodblog/api/src/functions/graphql.js: The "path" argument must be of type string. Received type undefined
api |
api |
api | 1 PluginPass.ImportDeclaration
api | /Users/alvincrespo/redwoodblog/node_modules/@redwoodjs/core/dist/babel-plugin-redwood-import-dir.js:108
api |
api | 2 newFn
api | /Users/alvincrespo/redwoodblog/node_modules/@babel/traverse/lib/visitors.js:175
api |
api | 3 NodePath._call
api | /Users/alvincrespo/redwoodblog/node_modules/@babel/traverse/lib/path/context.js:55
api |
api | 4 NodePath.call
api | /Users/alvincrespo/redwoodblog/node_modules/@babel/traverse/lib/path/context.js:42
api |
api | 5 NodePath.visit
api | /Users/alvincrespo/redwoodblog/node_modules/@babel/traverse/lib/path/context.js:92
api |
api | 6 TraversalContext.visitQueue
api | /Users/alvincrespo/redwoodblog/node_modules/@babel/traverse/lib/context.js:112
api |
api | 7 TraversalContext.visitMultiple
api | /Users/alvincrespo/redwoodblog/node_modules/@babel/traverse/lib/context.js:79
api |
api | 8 TraversalContext.visit
api | /Users/alvincrespo/redwoodblog/node_modules/@babel/traverse/lib/context.js:138
api |
api | Function "graphql" was not found.
api | POST /graphql 404 2.564 ms - 33
Going to try out the other solutions next to see what happens.
There we go! Got it going. Thanks everyone on this thread for the help!
I had to run the virtual npm server and publish packages/api and packages/core. Once I got those installed in the consuming app - everything loaded up beautifully.
I’ll try that next time. Good to know I wasn’t far off in my workaround (sometimes you don’t trust yourself and think I must be doing something wrong).
Hi all. Excited to see this conversation thread. Admittedly, I only gave it a quick read but wanted to add my 2¢.
One of the holes in our dev tooling is that new packages in Framework code are not accounted for by Yarn correctly in your App/Project. (We had the same issue when we relied on yarn link. Current process is a major improvement!) For example, someone added webpack-retry-chunk-load-plugin package and it’s in the latest code for main in the @redwoodjs/core. BUT this package is not being used in the version of @redwoodjs/core used when you ran yarn install on your App. When you spin up the redwoodtools process, the code is copied from Framework to App, but the node_modules effectively is not updated.
And, given various workarounds, you all have discovered you need to install those packages manually in your App root package.json.
Some other options:
you can try to install the latest canary version in your App yarn rw upgrade -t canary. If the code you are modifying doesn’t have any new packages, and you’re using the latest canary, then the canary upgrade will install current packages in App.
start with the other contributing workflow for “Running a local NPM”. This actually replicates package installation and will correctly install local code + packages/modules. However, you have to install all the redwoodjs/packages unless you know which one(s) have new packages. And, if you update or add a package in your code, you’ll have to re-run the NPM process for that package.
I’m not sure how it would work, but I think an improved process will automate spinning up the local NPM registry and watch for changes, which would then trigger build/publish/check in your App.
Lastly, I haven’t ironed out all the details and steps here myself in one go. So mileage may vary
If I get an error about a missing package it’s because I’m not on the latest canary that introduced the new packages, or I introduced/ upgraded a new package myself, either way I usually just run yarn add -DW packagename in the project where I’m trying to see the changes.
