Новый комментарий

85bogdan45 05.05.2019 в 20:39

./node_modules/.bin/encore dev - выполняя данную команду ничего не происходит и терминал ругается на точку.
Если же выполнить данную команду npm run dev, то файлы компилируются.

Почему так?

Serge 09.08.2019 в 15:57

Error: ./node_modules/bootstrap/dist/js/bootstrap.min.js Error: Can't resolve 'jquery' in '/var/www/sites/edu/symfony4.loc/node_modules/bootstrap/dist/js'


npm WARN [email protected] requires a peer of [email protected] - 3 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of popper.js@^1.14.7 but none is installed. You must install peer dependencies yourself.


npm install [email protected]
npm install popper.js@^1.14.7


./node_modules/.bin/encore dev


Error: ./node_modules/bootstrap/dist/js/bootstrap.min.js Error: Can't resolve 'jquery' in '/var/www/sites/edu/symfony4.loc/node_modules/bootstrap/dist/js'


npm install jquery
npm install popper.js


./node_modules/.bin/encore dev


Build successful


Но стили bootstrapa так и не внедрились в страницу и не появились в папке public/build - там остался тот же самый app.css с несколькими строками
Правда появились папки vendors~js и vendors~css

Я подключил вот так - <link rel="stylesheet" href="{{ asset('build/vendors~css/app.css') }}">
и bootstrap-стили сработали. Но мои стили - нигде не проявляются

Попробовал поменять очереедность:

.addEntry('js/app', [
        './node_modules/bootstrap/dist/js/bootstrap.min.js',
        './assets/js/app.js'
    ])
    .addStyleEntry('css/app', [
        './node_modules/bootstrap/dist/css/bootstrap.min.css',
        './assets/css/app.css'
    ])

Это не помогло.

Вернул <link rel="stylesheet" href="{{ asset('build/css/app.css') }}">
Там опять таки только мои стили, без bootstrap

[serge@serge symfony4.loc]$ ./node_modules/.bin/encore dev
Running webpack ...

 DONE  Compiled successfully in 1860ms                                                                                                                                                                                               16:11:03

 I  7 files written to public/build
Entrypoint js/app [big] = runtime.js vendors~js/app.js js/app.css js/app.js
Entrypoint css/app [big] = runtime.js vendors~css/app.css vendors~css/app.js css/app.css
Serge 13.08.2019 в 18:26

Закрыл вопрос с генерацией файлов стилей и js таким способом:

webpack.config.js:
Вот это вот:

.addEntry('js/app', [
        './node_modules/bootstrap/dist/js/bootstrap.min.js',
        './assets/js/app.js'
    ])
    .addStyleEntry('css/app', [
        './node_modules/bootstrap/dist/css/bootstrap.min.css',
        './assets/css/app.css'
    ])

Заменил на вот это вот:

    .addEntry('js/app', [
        './assets/bootstrap/dist/js/bootstrap.min.js',
        './assets/js/app.js'
    ])
    .addStyleEntry('css/app', [
        './assets/bootstrap/dist/css/bootstrap.min.css',
        './assets/css/app.css'
    ])

Естественно, вместе с заменой путей, скопировал и саму папку bootstrap в assets. Скомпилировало удачно. То есть, кроме надписи, что все удачно, еще и файл public/build/css/app.css содержит bootstrap-код. А до этого пробовал менять права на папку node_modules, переустанавливал npm и сам nodejs - все было без толку.

[email protected] 25.03.2020 в 02:22

"_Поэтому запускать вы можете так: ./nodemodules/.bin/encore dev" -ерунда, это вообще не команда.
если уж на то пошло то: cd node_modules/.bin && encore dev
--но это дает ошибку. Правильно получилось когда сделал по "родной" симфони документации: поставил Yarn (глобально, так сам выбрал) и потом просто в корне проекта: yarn encore dev
--и нормально пробилдилось.

MorskoyPes 18.12.2020 в 00:24

Если тоже ничего не получается и ошибки лезут уже из под крышки ноута, то Вам сюда -> https://symfony.com/doc/current/the-fast-track/ru/22-encore.html

P.S. Проходя этот курс не нужно скупиться на git commit

d.solodov 17.05.2021 в 15:45

Если по какой-то причине webpack ругается, что нет какого-то файла, открываем терминал в /node_modules/bootstrap и выполняем команду
npm install
npm установит необходимые для bootstrap зависимости.
Далее открываем терминал в папке проекта и выполняем команду
./node_modules/.bin/encore dev
Видим на экране монитора
webpack compiled successfully
и радуемся жизни!

Arhimedovich 17.03.2022 в 18:52

Для нормального отображения форм в twig предусмотрен шаблон форм с поддержкой bootstrap, для этого в конфигурационный файл config/packages/twig.yaml нужно прописать twig:
form_themes: ['bootstrap_4_layout.html.twig'].

da4nick 07.07.2022 в 12:24

Ругаться больше нету сил... (с)

Encore - это "обёртка" Симфони для пакета Webpack.
Сам Webpack использует npm.

Symfony 6.1

  1. Ставим npm
  2. где-то в доке вычитал, что Симфони "любит" yarn, поэтому тоже поставил
  3. ставим Encore
  4. тут офиц. док-ция тоже не без греха - больше ничего руками делать не надо: файлы webpack.config.js и assets/styles/app.css уже созданы

Собс-но всё...
bootstrap подключён, свои стили пишем в assets/styles/app.css...

Не забываем после изменения их компилировать:
./node_modules/.bin/encore dev

Кстати, результат можно посмотреть в public/build/...

da4nick 28.09.2022 в 16:57

Symfony 6.1

Подключение Bootstrap:

  1. Ставим Bootstrap

    npm install bootstrap --save-dev
  2. Переименовываем app.css в app.scss. В нём добавляем

    @import "~bootstrap/scss/bootstrap";
  3. В webpack.config.js включаем загрузку Sass
  4. Внимательно читаем на что ругается ( там д.б. строка с установкой sass-loader)

    ./node_modules/.bin/encore dev
Логические задачи с собеседований