我想从我的twig模板中加载供应商资产,这些资产是使用composer在供应商目录中下载的。
使用相对路径是一种解决方案(在此示例中,我将包括bootstrap css,但同样的问题是编写器所需的任何其他库,如jQuery,jQueryUI等。)
<link rel="stylesheet" href="{{ asset('../vendor/twbs/bootstrap/dist/css/bootstrap.min.css') }}" >
Symfony文档建议使用asset:install来生成从供应商目录到公共的符号链接,但我无法理解它是如何工作的。 assets:install -h不太清楚,让我了解如何将特定的供应商路径链接到公共目录。
使用
创建simlinkln -s /path/of/vendor/lib /path/public/dir
工作正常,但每次我使用编辑器查找更新时,都会删除创建的符号链接。
有关“最佳做法”的想法,包括来自供应商目录的资产吗?
谢谢
答案 0 :(得分:3)
之前,Assets用于将所有选定文件编译为文件名中具有当前版本的一个文件,但它与Symfony 4有所不同
根据这些文档
https://symfony.com/doc/current/frontend.html
https://symfony.com/doc/current/frontend/encore/bootstrap.html
您应该使用Webpack Encore并能够使用新的Asset系统
答案 1 :(得分:1)
就“最佳实践”而言,我通常将npm与gulp配合使用,或类似的方式使用,这会生成分发CSS和js文件,并输出到{{1}中的指定文件中}。
这是最近的项目public/
文件中的示例
package.json
运行{
"devDependencies": {
"bootstrap": "^4.1.3",
"gulp": "^4.0.0",
"gulp-concat": "^2.6.1",
"gulp-sass": "^3.1.0"
},
"scripts": {
"compile:styles": "gulp styles"
}
}
以获得最新版本等。
您也需要此npm install --save-dev bootstrap gulp gulp-concat gulp-sass
gulpfile.js
设置完成后,您可以从控制台运行
var gulp = require('gulp');
var concat = require('gulp-concat');
var sass = require('gulp-sass');
gulp.task('styles', function(){
return gulp
.src([
'app/Resources/sass/main.scss',
])
.pipe(sass({outputStyle:'compressed', includePaths: ['node_modules']}).on('error', sass.logError))
.pipe(concat('styles.min.css'))
.pipe(gulp.dest('public/css'));
});
,npm run compile:styles
SASS文件将被预处理,缩小并输出到app/Resources/sass/main.scss
。
请注意,gulp文件包含node_modules文件夹,因此您可以在public/css/styles.min.css
文件内导入引导程序,例如
main.scss
从树枝模板:
$primary: #55a367;
@import 'bootstrap/scss/bootstrap';
我通常同时提交<link rel="stylesheet" type="text/css" href="{{ asset('css/styles.min.css') }}">
和main.scss
答案 2 :(得分:0)
您无法告诉assets:install
链接到任意供应商目录的原因是该命令旨在遍历已安装的分发包列表并链接一个知名目录(Resources/public
)目录(如果存在)。它依赖于简短的包名称和现有目录,因此它只能与symfony包一起使用,不支持其他库,例如bootstrap或jquery。 (链接到当前的command source)。
当今处理前端库的推荐方法是encore。
在不可能的情况下,可以使用composer scripts。我不会将其称为“最佳实践”,它可能最终会带来超出其应有的麻烦,但是您可以考虑采用这种选择。
您将创建一个shell,php脚本或控制台命令,在此您基本上复制assets:install
的功能以链接您的库资产。安装新库时,仍然需要手动更新脚本,但是可以将其配置为在安装或更新软件包后自动运行。
将此简单的示例bash脚本复制到您的项目目录中,并将其命名为install_vendors.sh
:
#!/bin/bash
BASE_PATH=`pwd`
PUBLIC="public"
if [ "$1" != "" ]; then
PUBLIC=$1
fi;
PUBLIC=${BASE_PATH}/${PUBLIC}/vendor
VENDOR=${BASE_PATH}/vendor
rm $PUBLIC -rf
mkdir $PUBLIC
function link_asset
{
SOURCE_DIR=${VENDOR}/$1
TARGET_DIR=${PUBLIC}/$2
ln -s $SOURCE_DIR $TARGET_DIR
}
link_asset twbs/bootstrap/dist bootstrap
将其添加到scripts
的{{1}}部分和composer.json
:
auto-scripts
您也可以随时使用"scripts": {
"vendors:install": "bash install_vendors.sh",
"auto-scripts": {
"cache:clear": "symfony-cmd",
"assets:install %PUBLIC_DIR%": "symfony-cmd"
"@vendors:install"
},
// ...
}
执行它。
然后将它们包括在您的树枝文件中:composer run vendors:install
。