Unlimited WordPress themes, graphics, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. PHP
Code

Программируем с Yii2: работа с бандлами ресурсов

by
Difficulty:IntermediateLength:ShortLanguages:
This post is part of a series called How to Program With Yii2.
How to Program With Yii2: Sluggable Behavior
How to Program With Yii2: Blameable Behaviors

Russian (Pусский) translation by Anna k.Ivanova (you can also view the original English article)

Final product image
What You'll Be Creating

Если вы спрашиваете: «Что такое Yii?» то ознакомьтесь с моим предыдущим учебным пособием: Введение в Yii Framework, в котором рассматриваются преимущества Yii и которое включает обзор нового в Yii 2.0, выпущенного в октябре 2014 года.

В этой серии Yii2 я рассказываю читателям про Yii2 - фреймворк для PHP. В этом уроке я покажу вам, как добавить пользовательские скрипты и библиотеки JavaScript и CSS в приложение Yii. Yii использует концепцию, которую он называет Asset Bundles, чтобы упростить управление этими ресурсами.

В этих примерах мы продолжим работу над простым статусом из предыдущих руководств.

Просто напоминаю, что я участвую в нижеуказанных комментариях. Меня особенно интересует, если у вас разные подходы, дополнительные идеи или вы хотите предложить темы для будущих уроков.

Что такое бандл ресурсов?

Бандлы ресурсов Yii представляют собой группы файлов JavaScript и CSS, которые должны быть включены вместе на определенные страницы или на всём сайте. Asset Bundles позволяют легко группировать определенные группы скриптов и стилей для определенных областей вашего сайта. Например, в приложении Meeting Planner я могу легко включать API Google Адресов только на тех страницах, где они нужны.

Вот краткий пример этого. Мы создаем файл \frontend\assets LocateAsset.php:

Затем мы загружаем его в наш файл отображения - это довольно просто:

Когда вы просматриваете источник нашей страницы, вы увидите скрипты, созданные вместе с другими стандартными ресурсами Yii2 для форм, Bootstrap и т.д .:

В этом уроке я собираюсь провести вас через Asset Bundles, чтобы интегрировать подсчет символов в нашу форму статуса. Мы будем использовать это, чтобы обеспечить ограничение символов, похожее на максимум 140 символов в Twitter.

Если вам интересно увидеть это в действии в Yii1.x, я применил эту функцию в Работа с Twitter API: OAuth, Чтение и отправка (Tuts +).

Создание Asset Bundle

Создайте пакет Asset Bundle

В каталоге \assets мы создаем StatusAsset.php:

Я использовал комбинацию плагина jQuery simpleCountable, twitter-text.js (скрипт для текстовой обработки Twitter на основе JavaScript) и сценарий, который значительно облегчил корректировки URL: twitter_count.js; в Twitter, URL-адреса считаются 20 символами. Эти файлы находятся в \web\js.

Я также создал функцию ready для документа, чтобы вызвать их в \web\js\status-counter.js. В том числе yii\web\YiiAsset в нашем массиве $depends будет гарантировать, что JQuery загружается всякий раз, когда мы создаем этот ресурс.

Загрузка Asset Bundle

Создать экземпляра Asset Bundle легко, как показано в \views\status\_form.php ниже:

Это все, что нужно, чтобы активировать ваш счетчик символов в стиле Twitter:

Yii2 Character Counter in Action with StatusAsset AssetBundle

Я нашел Yii Asset Bundles простым и легким в управлении. Они помогают мне повторно использовать части JavaScript и CSS только в определенных областях моего приложения.

Что дальше?

Полное руководство по Yii2 описывает ряд дополнительных возможностей Asset Bundles. Вы можете управлять позиционированием загрузки скрипта для каждого пакета, например. POS_HEAD, POS_END. Вы можете настроить Asset Maps для загрузки определенных совместимых версий библиотек. Вы можете установить параметры JavaScript и CSS для дальнейшей условной загрузки ваших пакетов. Вы также можете использовать Asset Converters для компиляции кода LESS в CSS или TypeScript в JavaScript.

Следите за предстоящими учебниками в нашей серии Yii2, когда мы продолжаем погружаться в разные аспекты структуры. Вы также можете ознакомиться с моей серией статей Пишем свой стартап на PHP, в которой используется расширенный шаблон Yii2.

Я приветствую пожелания по темам. Вы можете оставить их в комментариях ниже или отправить мне по электронной почте на моем веб-сайте Lookahead Consulting.

Если вы хотите узнать, когда выйдет следующий учебник Yii2, подпишитесь на меня @reifman в Twitter или проверьте мою страницу инструктора. Моя страница инструктора будет включать все статьи из этой серии, как только они будут опубликованы.

Ссылки по теме

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.