从CakePHP 3中的供应商处加载javascript文件

时间:2014-11-04 13:43:57

标签: twitter-bootstrap cakephp-3.0

我的问题是如何从CakePHP 3.0中的vendors文件夹加载.js文件。我通过composer包含了twitter bootstrap。 .js文件位于/ vendor / twbs / bootstrap-sass / assets / javascripts /文件夹中。我不想将它移动到webroot,因为那样我将破坏作曲家提供的自动更新功能。有什么好建议吗?我不想复制文件并放弃作曲家的好处......

3 个答案:

答案 0 :(得分:6)

我找到了解决方案!如果我正在使用作曲家为什么不使用它,对吧? :)

在composer.json中:

"scripts": {
    "post-install-cmd": "App\\Console\\Installer::postInstall",
    "post-update-cmd": "App\\Console\\Installer::postUpdate"
}

在src / Console / Installer.php中:

public static function postUpdate(Event $event) {
    $io = $event->getIO();

    $rootDir = dirname(dirname(__DIR__));

    static::copyTwitterBootstrapFiles($rootDir, $io);
}

public static function copyTwitterBootstrapFiles($dir, $io) {

    $bootstrapJsSource = $dir . '/vendor/twbs/bootstrap-sass/assets/javascripts/bootstrap.js';
    $bootstrapJsDestination = $dir . '/webroot/js/bootstrap.js';

    if (file_exists($bootstrapJsSource)) {
        copy($bootstrapJsSource, $bootstrapJsDestination);
        $io->write('Copied `bootstrap.js` file');
    }

}

最后如果您使用git将webroot / bootstrap.js添加到.gitignore。 postUpdate在每个composer update命令之后运行,因此如果您想在每次实际的包更新后运行脚本,只需使用post-package-update而不是post-update-cmd。

答案 1 :(得分:0)

与mutdsu的答案相同,但有更多细节。

在composer.json中,在脚本下添加以下行:

"scripts": {
    ...
    "post-update-cmd": "App\\Console\\Installer::postUpdate",
    ...
},

它应该显示如下:

public static function postUpdate(Event $event) {
    $io = $event->getIO();
    $rootDir = dirname(dirname(__DIR__));
    static::copyBootstrapAssets($rootDir, $io);
}

public static function copyBootstrapAssets($dir, $io) {
    $ds = DIRECTORY_SEPARATOR;
    $bootstrapAssetsDir = $dir . $ds . 'vendor' . $ds . 'twbs' . $ds . 'bootstrap' . $ds . 'dist' . $ds;
    $bootstrapCssAssetsDir = $bootstrapAssetsDir . 'css' . $ds;
    $bootstrapJsAssetsDir = $bootstrapAssetsDir . 'js' . $ds;
    $bootstrapFontAssetsDir = $bootstrapAssetsDir . 'fonts' . $ds;
    $webrootDir = $dir . $ds . 'webroot' . $ds;
    $cssDir = $webrootDir . 'css' . $ds;
    $jsDir = $webrootDir . 'js' . $ds;
    $fontDir = $webrootDir . 'fonts' . $ds;
    if (!file_exists($cssDir) && !is_dir($cssDir)) {
        mkdir($cssDir);
    }
    if (!file_exists($jsDir) && !is_dir($jsDir)) {
        mkdir($jsDir);
    }
    if (!file_exists($fontDir) && !is_dir($fontDir)) {
        mkdir($fontDir);
    }
    $cssAssets = [
        'bootstrap.min.css',
        'bootstrap-theme.min.css',
    ];
    $jsAssets = [
        'bootstrap.min.js',
    ];
    $fontAssets = [
        'glyphicons-halflings-regular.eot',
        'glyphicons-halflings-regular.svg',
        'glyphicons-halflings-regular.ttf',
        'glyphicons-halflings-regular.woff',
        'glyphicons-halflings-regular.woff2',
    ];
    foreach ($cssAssets as $asset) {
        if (file_exists($bootstrapCssAssetsDir . $asset)) {
            copy($bootstrapCssAssetsDir . $asset, $cssDir . $asset);
            $io->write('Copied `' . $asset . '` file');
        } else {
            if (file_exists($cssDir . $asset)) {
                unlink($cssDir . $asset);
            }
        }
    }
    foreach ($jsAssets as $asset) {
        if (file_exists($bootstrapJsAssetsDir . $asset)) {
            copy($bootstrapJsAssetsDir . $asset, $jsDir . $asset);
            $io->write('Copied `' . $asset . '` file');
        } else {
            if (file_exists($jsDir . $asset)) {
                unlink($jsDir . $asset);
            }
        }
    }
    foreach ($fontAssets as $asset) {
        if (file_exists($bootstrapFontAssetsDir . $asset)) {
            copy($bootstrapFontAssetsDir . $asset, $fontDir . $asset);
            $io->write('Copied `' . $asset . '` file');
        } else {
            if (file_exists($fontDir . $asset)) {
                unlink($fontDir . $asset);
            }
        }
    }
}

在src / Console / Installer.php中,添加以下两个静态函数:

/webroot/css/bootstrap.min.css
/webroot/css/bootstrap-theme.min.css
/webroot/js/bootstrap.min.js
/webroot/fonts/glyphicons-halflings-regular.eot
/webroot/fonts/glyphicons-halflings-regular
/webroot/fonts/glyphicons-halflings-regular.ttf
/webroot/fonts/glyphicons-halflings-regular.woff
/webroot/fonts/glyphicons-halflings-regular.woff2
/webroot/fonts/glyphicons-halflings-regular.woff2

如果您使用的是git,请务必将这些行添加到您的.gitignore文件中:

send

答案 2 :(得分:0)

我不喜欢复制文件,因此基于先前的答案,我创建了创建引导文件链接的函数。请注意,对于Bootstrap4,它现在没有字体发布。

/**
 * Create Bootstrap4 assets links
 *
 * @param string $dir The application's root directory.
 * @param \Composer\IO\IOInterface $io IO interface to write to console.
 * @return void
 */

public static function createBootstrapLinks($dir, $io) {
    $ds = DIRECTORY_SEPARATOR;
    if (!file_exists($dir . $ds . 'vendor' . $ds . 'twbs' . $ds . 'bootstrap'))
    {
        $io->write('Bootstrap is not installed. Include Bootstrap into project: composer require twbs/bootstrap');
        return;
    }
    $bootstrapAssetsDir = realpath($dir . $ds . 'vendor' . $ds . 'twbs' . $ds . 'bootstrap' . $ds . 'dist');
    $bootstrapAssets = [
        'css' => $bootstrapAssetsDir . $ds . 'css' . $ds,
        'js' => $bootstrapAssetsDir . $ds . 'js' . $ds
    ];
    $webrootDir = realpath($dir . $ds . 'webroot');

    $webrootPathes = [
        'css' => $webrootDir . $ds . 'css' . $ds . 'bootstrap',
        'js' => $webrootDir . $ds . 'js' . $ds . 'bootstrap'
    ];

    foreach ($bootstrapAssets as $type => $asset)
    {
        if (!file_exists($asset))
        {
            $io->write('Asset `' . $asset . '` does not exists. Unable to create link.');
            continue;
        }
        $name = isset($webrootPathes[$type]) ? $webrootPathes[$type] : ($webrootDir . $type . $ds . 'bootstrap');
        if (file_exists($name))
        {
            switch(filetype($name))
            {
                case 'link':
                    $link_target = readlink($name);
                    if ($link_target == $asset)
                    {
                        $io->write('Correct link to `' . $asset . '` already exists. Fine.');
                    }
                    else
                    {
                        $io->write('Link `' . $name . '` already exists and points to `'. $link_target .'`. Unable to create link.');
                    }
                    break;
                case 'dir':
                    $io->write('Dir `' . $name . '` already exists. Unable to create link.');
                    break;
                default:
                    $io->write(filetype($name).' `' . $name . '` already exists. Unable to create link.');
                    break;
            }
        }
        else
        {
            $io->write('Link `' . $name . '` to `' . $asset . '` created. Fine.');
            symlink($asset, $name);
        }
    }
}