使用引导CSS和JS
编辑本页警告:您正在浏览的文档欧宝官网下载appob娱乐下载Symfony 5.1,现已不再维护。
读本页的更新版本用于Syob娱乐下载mfony 6.2(当前稳定版本)。
使用引导CSS和JS
本文解释如何安装和集成Bootstrap CSS框架在您的Symfoob娱乐下载ny应用程序中使用Webpack安可.首先,为了能够进一步定制,我们将进行安装引导
:
1
$Yarn添加bootstrap——dev
导入引导样式
现在,引导
生活在你的node_modules /
目录,您可以从任何Sass或JavaScript文件导入它。例如,如果你已经有一个global.scss
文件,从那里导入它:
1 2 3 4 5 6 7
/ /资产/风格/ global.scss//自定义Bootstrap变量$主要的:变黑(# 428 bca,20%);~允许你引用node_modules中的东西@ import“~引导/ scss /引导”;
就是这样!这将导入node_modules /引导/ scss / bootstrap.scss
文件到global.scss
.您甚至可以先自定义Bootstrap变量!
提示
如果你不需要所有的特性中包含特定的文件引导
改为目录。~引导/ scss /警报
.
导入Bootstrap JavaScript
Bootstrap JavaScript需要jQuery和Popper.js,所以确保你安装了这个:
1
$Yarn新增jquery popper.js——dev
现在,需要从任何JavaScript文件引导:
12 3 4 5 6 7 8 9 10 11 12 13 14
/ / app.js常量$ =需要(jquery的);//修改jquery模块:添加行为// bootstrap模块不输出/返回任何东西需要(“引导”);//或者你可以包含特定的片段/ /要求(“引导/ js / dist /工具提示”);/ /要求(“引导/ js / dist /弹出窗口”);$ (文档时(函数(){$ (“[data-toggle = "窗"]”) .popover ();});
使用其他Bootstrap / jQuery插件
如果你需要使用能很好地配合jQuery的jQuery插件,你可能需要使用Encore的autoProvidejQuery ()方法,这样这些插件就知道在哪里可以找到jQuery。然后,你可以像往常一样包括所需的JavaScript和CSS:
1 2 3 4 5 6 7
/ /……//需要JavaScript需要(“bootstrap-star-rating”);//需要2个CSS文件需要(“bootstrap-star-rating / css / star-rating.css”);需要(“bootstrap-star-rating /主题/ krajee-svg / theme.css”);
此工作,包括代码示例,是根据创作共用BY-SA 3.0许可证。