I’m trying to create a Symfony + React project, following the steps in the Symfony documentation.
However, am unable to continue past npm install, as default npm commands such as npm run watch, npm run dev, npm build or npm start all result in similar error:
$ npm run watch
npm ERR! Missing script: "watch"
npm ERR!
npm ERR! To see a list of scripts, run:
npm ERR! npm run
I’m running these commands from the base project directory, where package.json resides.
Contents of package.json itself:
{
"name": "myApp",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo "Error: no test specified" && exit 1"
},
"author": "",
"license": "MIT",
"devDependencies": {
"@babel/preset-react": "^7.24.7",
"@hotwired/stimulus": "^3.0.0",
"@hotwired/turbo": "^7.1.1 || ^8.0",
"@symfony/stimulus-bridge": "^3.2.0",
"@symfony/ux-react": "file:vendor/symfony/ux-react/assets",
"@symfony/ux-turbo": "file:vendor/symfony/ux-turbo/assets",
"react": "^18.0",
"react-dom": "^18.0"
}
}
Version of npm is 9.6.3, installed along with Node.js v19.9.0 into default directory (C:Program Filesnodejs).
1
Seem to have made it. The correct solution was generating package.json by installing symfony/webpack-encore-bundle instead of running npm init, and removing asset mapper dependencies as described in Bootstrap cannot find symfony/stimulus-bundle.
So on a fresh symfony project, this is the sequence that worked:
symfony new projectName --version="7.1.*" --webapp
cd projectName
composer remove symfony/ux-turbo symfony/asset-mapper symfony/stimulus-bundle
composer require symfony/webpack-encore-bundle symfony/ux-turbo symfony/stimulus-bundle
npm install
npm run watch
Resulting package.json then has scripts:
"scripts": {
"dev-server": "encore dev-server",
"dev": "encore dev",
"watch": "encore dev --watch",
"build": "encore production --progress"
}
and runs dev and watch with no conflicts.