Yii में css और js फ़ाइलों को स्वचालित रूप से कनेक्ट करें

शुभ दिन।

इस बार मैं Yii में css और js फ़ाइलों को स्वचालित रूप से कनेक्ट करने के तरीके के बारे में बात करना चाहता हूं। फॉर्म के प्रत्येक फ़ाइल के लिए संसाधनों (सीएसएस, जेएस, छवियों) के साथ एक संबंधित फ़ोल्डर संलग्न करना विचार है। यह सुविधाजनक है क्योंकि ज्यादातर मामलों में, विशिष्ट "संपत्ति" का उपयोग विशिष्ट दृश्य फ़ाइलों के लिए किया जाता है।

और इसलिए, कोड के करीब। आइए, नियंत्रक वर्ग का विस्तार करें (जो संभवतः आपके "घटकों" फ़ोल्डर :) में निहित है), इसमें निम्न कार्यक्षमता जोड़ते हैं:

/** * Array of paths of assets * @var array */ private $_assetsPaths = array(); /** * Array of asset Url * @var array */ private $_assetsUrl = array(); /** * Name of directory for css files * @var strign */ protected $_cssDirName = 'css'; /** * Default file name of css * @var string */ protected $_defaultCssFile = 'index.css'; /** * Name of directory for script files * @var strign */ protected $_scriptDirName = 'js'; /** * Default file name of script * @var string */ protected $_defaultScriptFile = 'index.js'; /** * Name of directory for images * @var strign */ protected $_imageDirName = 'images'; /** * This method is invoked at the beginning of {@link render()}. * * @param string $view the view to be rendered * @return boolean whether the view should be rendered. */ protected function beforeRender($view) { $this->_setupScript($view); $this->_setupCss($view); $viewCamelCase = preg_replace_callback( '/_([a-z0-9])/', function ($char) { return strtoupper($char[1]); }, ucfirst($view) ); $methodScript = '_setupScript' . $viewCamelCase; if (method_exists($this, $methodScript)) { $this->$methodScript($view); } $methodCss = '_setupCss' . $viewCamelCase; if (method_exists($this, $methodCss)) { $this->$methodCss($view); } return true; } /** * Setup script files * * @param string $view * @return void */ protected function _setupScript($view) { $scriptRealPath = $this->getScriptPath($view, $this->_defaultScriptFile); if (is_file($scriptRealPath)) { $scriptPublishedUrl = $this->getScriptUrl($view, $this->_defaultScriptFile); Yii::app()->clientScript->registerScriptFile($scriptPublishedUrl); } } /** * Setup css files * * @param string $view * @return void */ protected function _setupCss($view) { $cssRealPath = $this->getCssPath($view, $this->_defaultCssFile); if (is_file($cssRealPath)) { $cssPublishedUrl = $this->getCssUrl($view, $this->_defaultCssFile); Yii::app()->clientScript->registerCssFile($cssPublishedUrl); } } /** * Returns the published script URL * * @param string $view * @param string $fileName * @return string|false */ public function getScriptUrl($view, $fileName) { if (($publishedUrl = $this->getPublishedAssetsUrl($view))) { return $publishedUrl . '/' . $this->_scriptDirName . '/' . $fileName; } return false; } /** * Returns the real script Path * * @param string $fileName * @param string $view * @return string|false */ public function getScriptPath($view, $fileName) { if (($path = $this->getAssetsPath($view))) { return $path . DIRECTORY_SEPARATOR . $this->_scriptDirName . DIRECTORY_SEPARATOR . $fileName; } return false; } /** * Returns the published css URL * * @param string $view * @param string $fileName * @return string|false */ public function getCssUrl($view, $fileName) { if (($publishedUrl = $this->getPublishedAssetsUrl($view))) { return $publishedUrl . '/' . $this->_cssDirName . '/' . $fileName; } return false; } /** * Returns the real css path * * @param string $view * @param string $fileName * @return string|false */ public function getCssPath($view, $fileName) { if (($path = $this->getAssetsPath($view))) { return $path . DIRECTORY_SEPARATOR . $this->_cssDirName . DIRECTORY_SEPARATOR . $fileName; } return false; } /** * Returns the published image URL * * @param string $view * @param string $fileName * @return string|false */ public function getImageUrl($view, $fileName) { if (($publishedUrl = $this->getPublishedAssetsUrl($view))) { return $publishedUrl . '/' . $this->_imageDirName . '/' . $fileName; } return false; } /** * Returns the real image path * * @param string $view * @param string $fileName * @return string|false */ public function getImagePath($view, $fileName) { if (($path = $this->getAssetsPath($view))) { return $path . DIRECTORY_SEPARATOR . $this->_imageDirName . DIRECTORY_SEPARATOR . $fileName; } return false; } /** * Returns alias of assets * * @param string $view * @return string|false */ protected function getAssetsPath($view) { if (!array_key_exists($view, $this->_assetsPaths)) { $assetPath = false; $viewPath = $this->getViewFile($view); if ($viewPath) { if (($pos = strrpos($viewPath, DIRECTORY_SEPARATOR . 'views' . DIRECTORY_SEPARATOR)) !== false) { $extension = ($renderer=Yii::app()->getViewRenderer()) !== null ? $renderer->fileExtension : '.php'; $assetPath = substr($viewPath, 0, $pos) . DIRECTORY_SEPARATOR . 'assets' . substr($viewPath, $pos + 1 + strlen('views')); $assetPath = dirname($assetPath) . DIRECTORY_SEPARATOR . basename($assetPath, $extension); } } $this->_assetsPaths[$view] = $assetPath; } return $this->_assetsPaths[$view]; } /** * Returns the published asset URL * * @param string $view * @return string|false */ public function getPublishedAssetsUrl($view) { if (!array_key_exists($view, $this->_assetsUrl)) { $assetsUrl = false; $assetsPath = $this->getAssetsPath($view); if ($assetsPath) { $assetsUrl = Yii::app()->assetManager->publish($assetsPath); } $this->_assetsUrl[$view] = $assetsUrl; } return $this->_assetsUrl[$view]; } 

आइए देखें कि यह कैसे काम करता है। "पहले रेंडर ($ दृश्य)" में, रेंडर करने से पहले तरीके कहे जाते हैं:

 //   (      assets/{controllerName}/{viewName}/js/index.js) _setupScript($view) //   (      assets/{controllerName}/{viewName}/css/index.css) _setupCss($view) 

वे स्वचालित रूप से दिए गए दृश्य फ़ाइल के लिए संबंधित सीएसएस और जेएस फ़ाइलों को जोड़ते हैं।

इसके अलावा, यहां "पहलेरेंडर ()" में शैलियों और लिपियों को जोड़ने के लिए अतिरिक्त तरीके लॉन्च किए गए हैं (यदि परिभाषित किया गया है)। पिछले वाले से इन तरीकों के बीच का अंतर यह है कि वे एक विशिष्ट दृश्य फ़ाइल से बंधे हैं। यानी दृश्य फ़ाइल का नाम संबंधित विधि के नाम के निर्माण में शामिल है, उदाहरण के लिए, स्क्रिप्ट के लिए विधि का नाम नियम है: "_setupScript" + "ऊंट संकेतन में दृश्य फ़ाइल का नाम", शैलियों के लिए: "_uupupCss" + "ऊंट संकेतन में दृश्य फ़ाइल का नाम"।

इसके अलावा अब निम्नलिखित तरीके हमारे लिए उपलब्ध हैं:

वे तरीके जो प्रकाशित संसाधनों में URL लौटाते हैं:

 getScriptUrl($view, $fileName) //  URL   js  getCssUrl($view, $fileName) //  URL   css  getImageUrl($view, $fileName) //  URL     

वे तरीके जो संसाधनों के वास्तविक रास्तों को लौटाते हैं (संरक्षित संपत्ति में संपत्ति फ़ोल्डर में):

 getScriptPath($view, $fileName) //    js  getCssPath($view, $fileName) //    css  getImagePath($view, $fileName) //      

और सामान्य तरीके:

 getAssetsAlias($view) //     "assets",    protected getPublishedAssetsUrl($view) //  URL     "assets" 

निर्देशिकाओं के नाम (जेएस, सीएसएस फ़ाइलों और छवियों के लिए) और फाइलें नियंत्रक वर्ग के गुणों में डिफ़ॉल्ट रूप से परिभाषित की जाती हैं।

 protected $_cssDirName = 'css'; protected $_defaultCssFile = 'index.css'; protected $_scriptDirName = 'js'; protected $_defaultScriptFile = 'index.js'; protected $_imageDirName = 'images'; 

तदनुसार, आप उन्हें अपनी ज़रूरत के हिसाब से बदल सकते हैं। वैकल्पिक रूप से, आप उन्हें कोड में सरल संशोधन करते हुए, एप्लिकेशन कॉन्फ़िगरेशन में रख सकते हैं।

का प्रयोग करें।

आप या तो "_setupCss ($ view)" विधि को ओवरराइड कर सकते हैं यदि आपको नियंत्रक दृश्य की सभी संभावित फ़ाइलों के लिए सीएसएस फाइलें शामिल करने की आवश्यकता है:

 /** * Setup css files * * @param string $view * @return void */ protected function _setupCss($view) { parent::_setupCss($view); //   my_css_file.css     Yii::app()->clientScript->registerCssFile($this->getCssUrl($view, 'my_css_file.css')); } 

या विधि "_setupCss" + "को परिभाषित करें ऊंट संकेतन में दृश्य फ़ाइल का नाम" यदि आपको एक विशिष्ट दृश्य फ़ाइल के लिए सीएसएस फाइलें शामिल करने की आवश्यकता है:

 /** * Setup css files * * @param string $view * @return void */ protected function _setupCssRegistration($view) { Yii::app()->clientScript->registerCssFile($this->getCssUrl($view, 'my_css_file.css')); } 

पंजीकरण रेंडर करते समय इस पद्धति को केवल कहा जाएगा

चित्र निम्नानुसार प्राप्त किए जा सकते हैं:

 CHtml::image($this->getImageUrl($view)); 

वह सब है। ध्यान देने के लिए आप सभी का धन्यवाद।