webpack-encore: Installation guide does not work - yarn: Command "encore" not found

Followed the guideline for installing Encore on Symfony 4 as described here: https://symfony.com/doc/current/frontend/encore/installation.html

It consists of two steps:

composer require webpack-encore
yarn install

Requiring webpack-encore works fine. When I run yarn install, it does not install anything:

yarn install v1.9.4
warning package.json: No license field
warning No license field
[1/4] Resolving packages...
success Already up-to-date.

When I try to make a first build of encore, without changing anything, using

yarn encore dev

it gives me the following error:

yarn run v1.9.4
warning package.json: No license field
error Command "encore" not found.

About this issue

Original URL
State: open
Created 6 years ago
Reactions: 15
Comments: 17 (1 by maintainers)

Most upvoted comments

I just spent some time on this as well 😃 So I created a new project and this is what you get, copy/paste in package.json run yarn install and then yarn encore dev should work!

{
  "devDependencies": {
    "@symfony/webpack-encore": "^0.28.0",
    "core-js": "^3.0.0",
    "regenerator-runtime": "^0.13.2",
    "webpack-notifier": "^1.6.0"
  },
  "license": "UNLICENSED",
  "private": true,
  "scripts": {
    "dev-server": "encore dev-server",
    "dev": "encore dev",
    "watch": "encore dev --watch",
    "build": "encore production --progress"
  }
}

+21

nforced on Sep 18, 2019

Maybe this could/should be pointed out in the tutorial, it’s not really an obvious issue for those new to Symfony/Encore. It’s not a given thing that the very first thing you install with yarn is Encore and then you’re stuck.

smirgol on Aug 27, 2018

This is my install order for a fresh project:

composer create-project symfony/website-skeleton myproject
cd myproject

composer require symfony/apache-pack
composer require symfony/orm-pack
composer require symfony/maker-bundle --dev

[configure .env for doctrine and init database]

yarn add bootstrap --dev
yarn add jquery --dev
yarn add popper.js --dev

composer require webpack-encore
yarn install

Since I’ve installed bootstrap, jquery and popper before Encore, I do have a package.json, yes.

{
  "devDependencies": {
    "bootstrap": "^4.1.3",
    "jquery": "^3.3.1",
    "popper.js": "^1.14.4"
  }
}

Edit: It does indeed work if I install Encore before I install anything else with yarn. Once I’ve installed something with yarn, like bootstrap, it no longer works. Is there a workaround/fix for this, so I can add Encore to my existing project, or would I need to reinstall everything from scratch?

Edit2: About the workaround: I’ve copied the relevant parts from the new created project’s package.json to my existing project and called yarn install. Looks like it installed something. Gave me some warnings though:

yarn install v1.9.4
[1/4] Resolving packages...
warning @symfony/webpack-encore > css-loader > cssnano > autoprefixer > browserslist@1.7.7: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.
warning @symfony/webpack-encore > css-loader > cssnano > postcss-merge-rules > browserslist@1.7.7: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.
warning @symfony/webpack-encore > css-loader > cssnano > postcss-merge-rules > caniuse-api > browserslist@1.7.7: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.
[2/4] Fetching packages...
info fsevents@1.2.4: The platform "linux" is incompatible with this module.
info "fsevents@1.2.4" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved lockfile.

I’ll see if it works anyway. 😃

smirgol on Aug 24, 2018

When you require webpack-encore the recipe tries to copy this default package.json file. As you can see it contains the depencies missing in your case and some useful npm/yarn scripts.

The catch is… that copy doesn’t happen if a file already exists (to avoid overwriting user’s files).

It should work fine if you add bootstrap/jquery/popper.js after calling composer require webpack-encore.

Lyrkan on Aug 24, 2018

package.json doesn’t get indeed updated with the “scripts” section which is needed to run the commands from the tutorial. You can try to add them manually to avoid creating a new project and installing all again.

{
  "devDependencies": {
    ...
  },
  "scripts": {
    "dev-server": "encore dev-server",
    "dev": "encore dev",
    "watch": "encore dev --watch",
    "build": "encore production --progress"
  }
}

felixprojekt on Sep 7, 2019

Well, the problem I had was because yarn install and yarn add was removing the @symfony files in node_modules.

Make sure your NODE_ENV environment variable exists and is set to “development”, yarn install --production=false will do the trick as well, otherwise if you add any other packages it may end up removing them (the bastard).

This is why the command will not be found, at least in my case.

dukeofgaming on Jan 21, 2019