So laden Sie CSS, JS und statische Ressourcen in Yii2

In diesem Artikel wird hauptsächlich die Methode zum Laden statischer Ressourcen in Yii2 vorgestellt. Interessierte Freunde können darauf verweisen.

Anwendungsszenarien

Yii2 stellt die AppAsset-Klasse zur Verwaltung statischer Ressourcen bereit. Wenn Sie die Yii2-Layoutvorlage verwenden, möchten Sie einen Teil von js darin schreiben Eine Seite und am Ende der Seite ist es nicht möglich, Skript-Tags direkt zu verwenden.

Verwenden Sie die AppAsset-Klasse, um statische Ressourcen zu verwalten

Öffnen Sie assetAppAsset.php und definieren Sie addJs() und addCss() für die Einführung in statischen Seiten bzw. Externe JS- und CSS-Dateien

Ändern Sie den AppAsset.php-Dateicode

namespace backend\assets;
use yii\web\AssetBundle;
/**
 * @author Qiang Xue 
 * @since 2.0
 */
class AppAsset extends AssetBundle
{
  public $basePath = "@webroot";
  public $baseUrl = "@web";
  //默认自动加载样式
  public $css = [
    "css/site.css",
  ];
  //默认自动加载js
  public $js = [
  ];
  //依赖关系管理
  public $depends = [
    "yii\web\YiiAsset",
    "yii\bootstrap\BootstrapAsset",
  ];  
  //定义按需加载JS方法，注意加载顺序在最后 
  public static function addJs($view, $jsfile) { 
    $view->registerJsFile(
      $jsfile, 
      [
        AppAsset::className(), 
        "depends" => "backend\assets\AppAsset"
      ]
    ); 
  } 
  //定义按需加载css方法，注意加载顺序在最后 
  public static function addCss($view, $cssfile) { 
    $view->registerCssFile(
      $cssfile, 
      [
       AppAsset::className(), 
       "depends" => "backend\assets\AppAsset"
      ]
    ); 
  } 
}

2 auf der statischen Seite

<?php

use backend\assets\AppAsset;
AppAsset::register($this);
AppAsset::addJs($this,Yii::$app->request->baseUrl."/js/a.js");
AppAsset::addCss($this,Yii::$app->request->baseUrl."/css/b.css");
?>

Laden Sie den Javascript-Code unten auf der Website-Seite

The js-Datei oder Code innerhalb der Webseite, entsprechend Die Seitenladesequenz vermeidet die Ausführung des js-Zeitprozesses, was dazu führt, dass die Seite leer ist und eine schlechte Benutzererfahrung verursacht. Wird im Allgemeinen unten auf der Webseite nach platziert.

Option 1

<?php
$this->registerJs("
  $(function () {
  //为所欲为的写你想要写的js代码吧
  
  });
", \yii\web\View::POS_END);

Option 2

<?php $this->beginBlock(&#39;js&#39;) ?> 

  //js代码
  
<?php $this->endBlock() ?> 
<?php $this->registerJs($this->blocks[&#39;js&#39;], \yii\web\View::POS_END); ?>

Lösen Sie Yii2, um JS unten auf der Seite zu laden, und die Syntax-Eingabeaufforderung schlägt fehl

Fügen Sie einfach das Skript-Tag hinzu. Wenn Sie andere Methoden kennen, teilen Sie uns dies bitte mit. Vielen Dank!

Verwandte Empfehlungen:

So leeren Sie den Cache von Yii2-Assets

Das obige ist der detaillierte Inhalt vonSo laden Sie CSS, JS und statische Ressourcen in Yii2. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!