yii2cdn
A Yii Framework 2 component for using assets in different environments (Local/CDNs)
Production Ready: Used in several real projects is enough to prove its stability.
Minimum requirements: PHP 7.0+ / Yii2 Framework 2.0.12+
Bugs / Feature Request?: Create your issue here.
Resources
- Wiki: https://github.com/blacksmoke26/yii2cdn/wiki
- Class Reference: http://blacksmoke26.github.io/yii2cdn/api/
Installation
The preferred way to install this extension is through composer.
Either run
composer require --prefer-dist blacksmoke26/yii2cdn "*"
or add
"blacksmoke26/yii2cdn": "*"
to the require section of your composer.json file.
Usage
Info: This tutorial will demonstrate how to use FancyBox3 library in a production (online/CDN) or development (local/offline) environment.
I. Installing a library
- Create a cdn directory under the
/root/webfolder. - Install or download
FancyBox3library under cdn directory.
- Path should be
/root/web/cdn/jquery-fancybox. - CDN URLs: https://cdnjs.com/libraries/fancybox/3.3.5
II. Add a component
- Open
@app/config/main.phpin your code editor. - Add a new property
cdnundercomponentssection like the following code:
// ...
'components' => [
// ...
'cdn' => [
'class' => '\yii2cdn\Cdn',
'baseUrl' => '/cdn',
'basePath' => dirname(__DIR__) . '/web/cdn',
'components' => [
'jquery-fancybox' => [
'css' => [
'@attributes' => [
'noNameInPathUrls' => true, // Hide /css in urls
],
[
'dist/jquery.fancybox.css', // offline version
'@cdn' => '//cdnjs.cloudflare.com/ajax/libs/fancybox/3.3.5/jquery.fancybox.min.css', // online version
],
],
'js' => [
'@attributes' => [
'noNameInPathUrls' => true, // Hide /js in urls
],
[
'dist/jquery.fancybox.js', // offline version
'@cdn' => '//cdnjs.cloudflare.com/ajax/libs/fancybox/3.3.5/jquery.fancybox.min.js', // online version
],
],
],
],
],
// ...
],
// ...
III. Registering assets
- Open any view file and paste the following line:
//...
Yii::$app->cdn->get('jquery-fancybox')->register();
//...
IV. Final moment
- Browse the action url in your browser and check the view souce.
Now it's time to play around, See ya!