javascript - Yii2 按顺序注册 JS 文件和内联 JS 的组合

Question

我正在尝试从 Google Analytics docs 中注册以下内容:

<!-- Google Analytics -->
<script>
  window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
  ga('create', 'UA-XXXXX-Y', 'auto');
  ga('send', 'pageview');
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
<!-- End Google Analytics -->

所以我在我的小部件中做了以下操作:

$this->view->registerJs('
    window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
    ga(\'create\', \'UA-XXXXX-Y\', \'auto\');
    ga(\'send\', \'pageview\');
', View::POS_HEAD);

$this->view->registerJsFile(
    'https://www.google-analytics.com/analytics.js',
    [
       'async'=>'async',
       'position' => View::POS_HEAD,
    ]
);

但是注册的 JS 文件先于 Inline JS 出现。有没有办法让脚本遵守顺序？

我考虑过使用 AssetBundle 和“依赖”协议(protocol)，但 Yii2 文档中没有关于 AssetBundle 中的内联 JS 的内容。

你可以给内联 JS 一个键，但遗憾的是“依赖”协议(protocol)需要一个类名。

Answer 1

您可以将第一个代码块移动到一个 js 文件中，并在 Assets 包中使用它。然后对于第二个 js url 使用该 Assets 作为依赖

google_analytics.js

window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
 ga('create', 'UA-XXXXX-Y', 'auto');
 ga('send', 'pageview');

GoogleAnalyticsAsset.php

<?php

namespace app\assets;

use yii\web\AssetBundle;

class GoogleAnalyticsAsset extends AssetBundle
{
   public $basePath = '@webroot/web';
   public $baseUrl = '@web/web';

   public $jsOptions = ['position' => \yii\web\View::POS_HEAD];
   public $css = [
   ];
   public $js = [
       'js/google_analytics.js',
   ];
   public $depends = [
   ];
}

在你的小部件里面

use app\assets\GoogleAnalyticsAsset;
public function init() {
    GoogleAnalyticsAsset::register( $this->getView() );
    parent::init();
}

public function run()
{
   $this->registerJsFile('https://www.google.com/jsapi',['position' => \yii\web\View::POS_HEAD,'depends' => 'app\assets\GoogleAnalyticsAsset']);
}