Як мені розгорнути мої ресурси Encore?

При розгортанні ваших ресурсів, варто памʼятати 2 важливі речі.

1) Запустіть виробництво encore

Оптимізуйте ваші ресурси для виробництва, виконавши:

1

$ ./node_modules/.bin/encore production

Це зменшить ваші ресурси та виконає інші оптимізації продуктивності. Ура!

Але на якому сервері слід виконувати цю команду? Це залежить від того, як ви розготаєте. Наприклад, ви можете виконати її локально (або на серверві побудови) і використати rsync або щось ще, щоб перенести побудовані файли на ваш сервер. Або ви можете розташувати ваші файли на серверві виробництва спочатку (наприклад, через git pull), а потім виконати цю команду у виробництві (в ідеалі до того, як до вашого коду дійде трафік). У цьому випадку вам знадобиться встановити Node.js на вашому сервері виробництва.

2) Розгортайте лише побудовані ресурси

Єдині файли, які потрібно розгортувати на ваших серверах виробництва - це фінальні, побудовані ресурси (наприклад, каталог public/build). Вам не потрібно встановлювати Node.js, розгорніть webpack.config.js, каталог node_modules або навіть ваші файли джерел ресурсів, окрім випадків, коли ви плануєте запускати encore production на вашій машині виробництва. Коли ваші ресурси будуть побудовані, вони будуть єдиним, що має жити на сервері виробництва.

Чи потрібно мені встановлювати Node.js на моєму сервері виробництва?

Ні, хіба що ви плануєте побудувати ваші ресурси виробництва на вашому сервері виробництва, що не рекомендовано. Див. Як мені розгорнути мої ресурси Encore?.

Які файли мені варто зафіксувати в git? А які варто ігнорувати?

Вам варто фіксувати всі ваші файли в git, окрім каталогу node_modules/ та побудованих файлів. Ваш файл .gitignore повинен містити:

1
2
3

/node_modules/
# любой путь, который вы передаёте Encore.setOutputPath()
/public/build

Вам варто зафіксувати всі ваші файли джерел ресурсів, package.json і yarn.lock.

Мій додаток живе у підкаталозі

Якщо ваш додаток не живе у корені вашого веб-сервера (тобто, він живе у підкаталозі, на кшталт /myAppSubdir), вам просто потрібно сконфігурувати це при виклику Encore.setPublicPath():

1
2
3
4
5
6
7
8
9
10
11
12
13
14

// webpack.config.js
Encore
    // ...

    .setOutputPath('public/build/')

-     .setPublicPath('/build')
+     // це ваш *справжній* публічний шлях
+     .setPublicPath('/myAppSubdir/build')

+     // тепер це необхідно, щоб ваші ключі manifest.json все ще були `build/foo.js`
+     // (что является файлом, используемым функцией Symfony)
+     .setManifestKeyPrefix('build')
;

Якщо ви використовуєте скорочення Twig encore_entry_script_tags() і encore_entry_link_tags() (або обробляєте ваші ресурси через entrypoints.json чи якимось іншим чином), ви закінчили! Ці методи скорочень зчитують файл entrypoints.json , який тепер міститиме підкаталог.

"jQuery не визначено" або "$ не визначено"

Ця помилка трапляється, коли ваш код (або якась використовувана вами бібліотека) очікує, що $ або jQuery буде глобальною змінною. Але коли ви викорирстовуєте Webpack та require('jquery'), ніякі глобальні змінні не встановлюються.

Рішення залежить від того, відбувається ця помилка у вашому коді чи в якійсь сторонній бібліотеці, яку ви використовуєте. Див. jQuery і додатки наслідування, щоб дізнатися, як виправити це.

Неспіймана ReferenceError: webpackJsonp не визначено

Якщо ви отримуєте цю помилку, то це скоріш за все через те, що ви забули додати тег script для файлу runtime.js, який містить час виконання Webpack. Якщо ви використовуєте функцію Twig encore_entry_script_tags(), цього не має статися: тег скрипту файлу відображається автоматично.

Ця залежність не була знайдена: деякий модуль в ./path/to/file.js

Зазвичай, після того, як ви встановлюєте пакет через yarn, ви можете запитати/імпортувати його для використання. Наприклад, після запуску yarn add respond.js або npm install respond.js, ви спобуєте запитати цей модуль:

1

require('respond.js');

Але замість того, щоб все працювало, ви бачите помилку:

Ця залежність не була знайдена:

• respond.js in ./assets/app.js

Зазвичай, пакет буде "рекламувати" свій "головний" файл, додаючи ключ main до його package.json. Але іноді старі бібліотеки не матимуть цього. Замість цього, вам потрібно буде конкретно вимагати файл, який вам потрібен. У цьому випадку, файл, який вам потрібно використати, знаходиться в node_modules/respond.js/dest/respond.src.js. Ви можете запитати його через:

1
2

// запитати не зменшений файл, якщо це можливо
require('respond.js/dest/respond.src.js');

Мені потрібно запустити Babel у сторонньому модулі

З міркувань продуктивності, Encore не обробляє бібліотеки всередині node_modules/ через Babel. Але ви можете змінити це за допомогою методу configureBabel(). Див. Конфігурація Babel, щоб дізнатися більше.

Як мені інтегрувати мою конфігурацію Encore в мій IDE?

Інтеграція Webpack в PhpStorm та інші IDE робить вашу розробку продуктивнішою (наприклад, розвʼязуючи псевдоніми). Однак, ви можете зіштовхнутися з цією помилкою:

1
2
3
4

Encore.setOutputPath() це не може бути викликаний, так як середовище виконання
схоже ще не сконфігуровано. Переконайтеся в тому, що ви використовуєте виконуване
encore або спочатку викличте Encore.configureRuntimeEnvironment(), якщо ви
спеціально не викликаєте Encore напряму.

Помилка відбувається тому, що середовище виконання Encore конфігурується лише тоді, коли ви його запускаєте (наприклад, при виконанні yarn encore dev). Виправте цю проблему, викликавши методи Encore.isRuntimeEnvironmentConfigured() і Encore.configureRuntimeEnvironment():

1
2
3
4
5
6
7
8

// webpack.config.js
const Encore = require('@symfony/webpack-encore')

if (!Encore.isRuntimeEnvironmentConfigured()) {
    Encore.configureRuntimeEnvironment(process.env.NODE_ENV || 'dev');
}

// ... решта конфігурації Encore

Мої тести зазнають невдачі через файл entrypoints.json

Після установки Encore, ви можете побачити наступну помилку при запуску тестів локально на вашому сервері Безперервної інтеграції:

1
2
3
4

Неспіймане PHP-розширення Twig\Error\RuntimeError:
"Виключення було викликано під час відображення з шаблону
("Не було знайдено файли точок входу з Webpack:
файл "/var/www/html/public/build/entrypoints.json" не існує.

Це відбувається тому, що ви не побудували ваші ресурси Encore, а отже немає файлу entrypoints.json. Щоб вирішити цю проблему, або побудуйте ресурси Encore, або встановіть опцію strict_mode як false (це запобігає тому, щоб функції Twig Encore викликали виключення, коли немає файлу entrypoints.json):

1
2
3
4

# config/packages/test/webpack_encore.yaml
webpack_encore:
    strict_mode: false
    # ...