Каков наилучший способ отделить один файл JavaScript от минимизированного сценария?

Question

Я не уверен, что это лучший способ сформулировать мой вопрос.

У меня есть скрипт, который я хочу запустить на одной странице сайта. Все файлы .js включены / импортированы в файл app.js, который затем минимизируется и включается в layout.html, который используется на каждой странице. Есть один файл javascript, который я хочу использовать только на одной из этих страниц (страницы, на которых он мне не нужен, создают ошибку в консоли, поэтому я не могу просто оставить ее). Каков наилучший способ включить это. Могу ли я включить его в минимизированный скрипт, но только на этой странице?

Answer 1

Если вы создаете обычную страницу HTML + CSS + JS, вы можете просто добавить этот файл javascript (или больше, если хотите) в отдельную папку, а затем вызвать его в нужном HTML-файле.

EG - это ваша структура

-index.html
-about.html
-js-for-minify/do.js
-js/not.js
-dist/minified.js
-css

вы можете сослаться на about.html, чтобы иметь тег script, который направлен на незавершенный файл.

<script src="js/not.js">

в то время как для index.html вы можете ссылаться на уменьшенный файл

<script src ="dist/minified.js">

Answer 2

У вас есть три варианта:

1. Включите скрипт в минимизированный app.js, но измените его, чтобы он проверял, нужен ли он (например, проверьте, присутствуют ли вещи, над которыми он должен работать, а не предполагая, что они есть) перед запуском. Таким образом, app.js одинаково на всех страницах, может храниться в кэше, ваш сценарий сборки прост и т. Д.

2. Иметь app.js, который не включает скрипт, и отдельную минимизированную версию скрипта, которую вы включаете только на нужную страницу, используя отдельный тег script. Ваш сценарий сборки по-прежнему довольно прост и добавляет только один HTTP-запрос к целевой странице.

3. Имеют два уменьшенных app.js файла, app.js и app-plus.js (или что-то еще). Включите app.js на всех других страницах, но включите app-plus.js на целевой странице. Это усложняет layout.html, потому что оно должно определить, какой скрипт включать, и усложняет ваш скрипт сборки (очень незначительно).

Если скрипт для конкретной страницы не является массовым, вариант № 1, вероятно, будет вашим лучшим выбором из-за простоты (дополнительные несколько килобайт после установления HTTP-соединения обычно не имеют большого значения), но это действительно зависит на вашей ситуации. Если вам нужно поддерживать потребителей с довольно низкой пропускной способностью (мобильные телефоны в высокоскоростных пакетах данных), это может привести к нежелательному включению сценария. Вам решать.