当前位置： 技术文章>> 将自定义CSS / JS添加到Magento 2模块中

文章标题：将自定义CSS / JS添加到Magento 2模块中
  • 文章分类: Magento
  • 20326 阅读
文章标签: magento magento教程 magento二次开发 magento中文教程 php
系统学习magento二次开发，推荐小册：《Magento中文全栈二次开发 》

Magento中文全栈二次开发

本小册面向Magento2以上版本，书代码及示例兼容magento2.0-2.4版本。涵盖了magento前端开发，后端开发，magento2主题,magento2重写,magento2 layout,magento2控制器,magento2 block等相关内容,带领您成为magento开发技术专家。

有几个选项可以将自定义CSS / JS添加到Magento 2模块中，以下选项是最简单的。

首先，您应该在模块文件夹中创建视图/<区域>/布局/默认.xml文件，例如，该文件可以是app/code/Df/Core。

不要忘记将<区域>替换为adminhtml或前端。

这是默认.xml的样子：

<?xml version="1.0"?>
<page
   xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
   layout="admin-1column"
   xsi:noNamespaceSchemaLocation="../../../../../../../lib/internal/Magento/Framework/View/Layout/etc/page_configuration.xsd"
>
   <head>
       <link src="Df_Core::core.js"/>
       <css src="Df_Core::core.css"/>
   </head>
   <body/>
</page>

将Df_Core替换为模块的名称，并将核心.js и 核心.css文件放入视图/<区域>/Web 文件夹。

此外，您可以对更少的文件执行相同的操作。创建 core.less 文件而不是 core.css并将其引用为 <css src=“Df_Core：：core.css”/>更改上面的默认值.xml示例。因此，系统会将您的较少文件编译为 css。因此，您将能够在Magento 2模块中使用更少的文件！


推荐文章