README

具有注册 RequireJS 模块功能的 Yii2 视图类

安装

安装此扩展的首选方法是通过composer。

运行以下命令之一：

php composer.phar require --prefer-dist h8every1/yii2-requirejs-view "*"

或者将以下内容添加到您的composer.json文件的require部分：

"h8every1/yii2-requirejs-view": "*"

用法

更改全局的View类

您可以通过编辑您的config/main.php文件来使用全局的 View 类

 'components' => [
    ...
    'view'=> [
        'class'=> 'h8every1\requirejsview\View',
        'mainJsUrl'=> '@web/js/requirejs/main.js',
    ],
    ...
 ],

您必须提供的唯一选项是mainJsUrl，它是包含 RequireJS 模块配置的main.js文件的 URL。（有关main.js的更多信息，请参阅RequireJS 文档）

mainJsUrl传递给\yii\helpers\Url::to()，因此可以是string或指向main.js文件URL的array。您可以使用别名'@web/js/requirejs/main.js'

之后，您所有的视图文件都将成为h8every1\requirejsview\View的实例，而不是yii\web\View。

在单个控制器中更改View类

在控制器的init函数中添加对View构造函数的调用，如下所示

class SiteController extends Controller
{
    public function init()
    {
        parent::init();
        $this->view = new \h8every1\requirejsview\View(['mainJsUrl' => '@web/js/requirejs/main.js']);
    }
    ...
}

为控制器的单个动作更改View类

..与更改整个控制器的视图相同，除了您需要在动作中添加以下行

class SiteController extends Controller
{
    ...
    
    public function actionIndex()
    {
        $this->view = new \h8every1\requirejsview\View(['mainJsUrl' => '@web/js/requirejs/main.js']);

        return $this->render('index');
    }
    
    ...
}

使用AssetBundle生成main.js

此扩展提供了一个MainJsAction类，可以用于生成自动对网页注册的所有模块执行require()的main.js文件。

您可以使用现有的控制器或创建一个新的控制器。然后您必须注册操作如下

class RequireJsController extends Controller
{

    public function actions()
    {
        return [
            'main'=> [         // you can use whatever name you like
                'class'=> '\h8every1\requirejsview\MainJsAction',
                'options'=>[
                    'modules'=>[
                        '\h8every1\requirejsview\assets\YiiAsset',
                        '\h8every1\requirejsview\assets\JqueryAsset',
                        '\h8every1\requirejsview\assets\ExampleAsset',
                    ]
                ],
            ],
        ];
    }

}

然后在您的View类设置中提供$mainJsUrl = ['<contollerName>/<actionName>']。对于上面的示例，设置将如下所示;

 'components' => [
    ...
    'view'=> [
        'class'=> 'h8every1\requirejsview\View',
        'mainJsUrl'=> ['/require-js/main'],
    ],
    ...
 ],

您需要提供RequireJsAssetBundle的数组作为modules。其中一些模块已经在扩展的assets文件夹中提供。

• jQuery (https://jqueryjs.cn)
• Bootstrap (https://bootstrap.ac.cn)
• Angular (https://angularjs.org)
• Lodash (https://lodash.node.org.cn)
• DomReady (https://github.com/requirejs/domReady)
• Yii2 资产（yii.js）(https://yiiframework.cn/doc-2.0/guide-output-client-scripts.html#yii.js)
• 为您的模块提供示例资产，并在实时网站上使用文件的压缩版本

注意：上述资产包的所有第三方脚本都应该使用Composer作为bower资产安装。

RequireJsAssetBundle和 Yii 的默认AssetBundle之间的主要区别是您需要提供模块之间的依赖关系，而不是使用$depend字段，而是在$js字段中。

在视图文件中添加和删除 RequireJS 模块

在您的视图文件中，您可以调用$this->addModule($moduleName)或$this->addModules($arrayOfModuleNames)

前者接受单个模块名的string，后者接受字符串的array。每个都应该是已注册的 RequireJS 模块。

如果您全局注册 View 类，您甚至可以在通过 $this->render() 渲染的布局和部分中注册模块。

您可以通过 $this->removeModule($moduleName) 或 $this->removeModules($arrayOfModuleNames) 来移除已注册的模块。

如果您想在主视图文件中用子视图文件中的另一个模块替换已加载的模块，这将非常有用。

示例

views/site/index.php

<?php

/* @var $this h8every1\requirejsview\View */


$this->title = 'My Yii Application';
$this->addModules(['app','map']);
echo $this->render('partial');
?>

views/site/partial.php

<?php
/* @var $this h8every1\requirejsview\View */

$this->removeModule('map');
$this->addModule('gmaps');

?>

已知问题

您不能移除在布局文件中注册的模块，因为 Yii 在所有动态内容生成并注册和移除所有 RequireJS 模块之后，在内容渲染的最后一步应用布局。