Error: Unable to find 'razzle-plugin-scss' or scss/razzle-plugin'

I've just generated a new project using the cookiecutter

  - Plone version: 6.0.7
  - Volto version: 17.2.0
  - Volto Generator version: 7.0.1

The backend starts fine, but when I start the frontend I get this error. This is macOS Sonoma 14.0 (ok, a bit bleeding edge). I believe I have all the requirements installed as per Install Plone from its packages – Install — Plone Documentation v6.0

% make start-frontend
 ERROR  Unexpected error

Error: Unable to find 'razzle-plugin-scss' or scss/razzle-plugin'
    at loadPlugin (/Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/config/loadPlugins.js:61:11)
    at loadPlugin (/Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/config/loadPlugins.js:8:12)
    at /Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/config/loadPlugins.js:69:12
    at Array.map (<anonymous>)
    at loadPlugins (/Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/config/loadPlugins.js:68:18)
    at /Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/config/loadRazzleConfig.js:58:9
    at new Promise (<anonymous>)
    at module.exports (/Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/config/loadRazzleConfig.js:17:10)
    at /Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/scripts/start.js:53:5
    at new Promise (<anonymous>)
    at main (/Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/scripts/start.js:52:10)
    at Object.<anonymous> (/Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/scripts/start.js:246:1)
    at Module._compile (node:internal/modules/cjs/loader:1267:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1321:10)
    at Module.load (node:internal/modules/cjs/loader:1125:32)
    at Module._load (node:internal/modules/cjs/loader:965:12)
make[1]: *** [start] Error 1
make: *** [start-frontend] Error 2

This usually happens when the generator being used is the old one (6.x.x) instead of the latest (7.x.x) that should be used for Volto 17. I tried cookiecutter this weekend and all went well. Could you try again? Also, make sure you don't have an old version of the generator installed in your npm environment.

npm remove @plone/generator-volto
npm i -g @plone/generator-volto

Not sure if this makes a difference, but @tkimnguyen what version of Node was active when you ran the generator?

% node --version
v20.0.0
% npm view @plone/generator-volto version
7.0.1

...and removing and reinstalling @plone/generator-volto pulls down the same version

This error is specific to my MacBook... works on my iMac. Both are macOS 14.1 Sonoma.

Maybe there's a way to force the installation of razzle-plugin-scss or scss/razzle-plugin

Maybe clearing the npm cache would help. Also, yarn cache clean. Installing and using a different node version would help (nvm install 18; nvm use 18)

Bummer... no change

% npm cache clean --force
npm WARN using --force Recommended protections disabled.
% npm cache verify
Cache verified and compressed (~/.npm/_cacache)
Content verified: 0 (0 bytes)
Index entries: 0
Finished in 0.007s
% yarn cache clean
➤ YN0000: Done in 0s 1ms
% nvm install 18; nvm use 18
Downloading and installing node v18.18.2...
Downloading https://nodejs.org/dist/v18.18.2/node-v18.18.2-darwin-arm64.tar.xz...
############################################################################################################################################################################################ 100.0%
Computing checksum with shasum -a 256
Checksums matched!
Now using node v18.18.2 (npm v9.8.1)
Now using node v18.18.2 (npm v9.8.1)
% make start-frontend
 ERROR  Unexpected error

Error: Unable to find 'razzle-plugin-scss' or scss/razzle-plugin'
    at loadPlugin (/Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/config/loadPlugins.js:61:11)
    at loadPlugin (/Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/config/loadPlugins.js:8:12)
    at /Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/config/loadPlugins.js:69:12
    at Array.map (<anonymous>)
    at loadPlugins (/Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/config/loadPlugins.js:68:18)
    at /Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/config/loadRazzleConfig.js:58:9
    at new Promise (<anonymous>)
    at module.exports (/Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/config/loadRazzleConfig.js:17:10)
    at /Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/scripts/start.js:53:5
    at new Promise (<anonymous>)
    at main (/Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/scripts/start.js:52:10)
    at Object.<anonymous> (/Users/bubba/src/plone-site/triangle-manufacturing/frontend/node_modules/razzle/scripts/start.js:246:1)
    at Module._compile (node:internal/modules/cjs/loader:1256:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)
    at Module.load (node:internal/modules/cjs/loader:1119:32)
    at Module._load (node:internal/modules/cjs/loader:960:12)
make[1]: *** [start] Error 1
make: *** [start-frontend] Error 2

@tiberiuichim had suggested I try these commands:

cd frontend;
rm -rf node_modules;
nvm use 18;
npm install -g yarn
yarn install
yarn start

which I did but I ended up with the same error.

So I restarted with a new cookiecutter project in a new directory, and it all worked fine. Mysterious!

Summary:
  - Plone version: 6.0.7
  - Volto version: 17.3.0
  - Volto Generator version: 7.0.1
  - Output folder: /Users/bubba/src/plone-site/triangle-manufacturing-document-store

Frontend codebase:
 - Generate frontend application with @plone/volto 17.3.0
 - Generate addon volto-triangle-manufacturing-document-store

Backend codebase
 - Remove folder src/triangle_manufacturing_document_store/src/triangle_manufacturing_document_store/tests not used by pytest
 - Format generated code in the backend

A couple of possible improvements?

  • cookiecutter should say whether or not it updated the recipe (it prompts y/n if it should reuse the existing one or delete and redownload it, but it should maybe check first if there is an update and not ask if there isn't one, and if there is one it should say which version I have and which newer one is available)
  • a few times now I've been caught with docker not running so cookiecutter fails and I have to rerun it and (yeah, it's a small thing) I have to re-answer all those questions :D, so maybe cookiecutter could also check if docker is running, at the very start of the run when it does its sanity checks (which pass so it's checking if docker is installed but not if the daemon is running)
Sanity checks
--------------------------------------------------------------------------------
  [1/5] Python: ✓
  [2/5] Node: ✓
  [3/5] yo: ✓
  [4/5] Docker: ✓
  [5/5] git: ✓

[...]
Error while running ['make', 'format']:
docker: Cannot connect to the Docker daemon at unix:///var/run/docker.sock. Is the docker daemon running?.
See 'docker run --help'.
make: *** [format] Error 125


ERROR: Stopping generation because post_gen_project hook script didn't exit successfully
Hook script failed (exit status: 1)

a few times now I've been caught with docker not running so cookiecutter fails and I have to rerun it and (yeah, it's a small thing) I have to re-answer all those questions

There's an open issue related to this which would probably be a good starter issue for someone who wants to contribute to cookiecutter-plone-starter.

Btw, you can run cookiecutter with the --replay option to try again with your previous answers!

4 Likes

:exploding_head::nerd_face::partying_face: