Laravel药剂混合咕嘟咕嘟两个独立的减档(Laravel Elixir Gulp mix two

2019-10-22 08:36发布

在Laravel 5我想创建两个不同的CSS文件,我的网站的前端和后端的网站(CMS)。 源文件是在两个不同的目录。

在资产的默认值

第一后端

elixir.config.assetsDir = 'resources/backend/';

elixir(function (mix) {
    mix.less('backend.less');
});

第二前端

elixir.config.assetsDir = 'resources/frontend/';

elixir(function (mix) {
    mix.less('frontend.less');
});

两者都是在同一个gulpfile.js。

这些是目录(Laravel 5)

resources
    backend
        less
            backend.less
    frontend
        less
            frontend.less

只有前端文件被编译到公共/ CSS / frontend.css。

我也试过

mix.less('frontend.less', null, 'resources/frontend/');

虽然这工作了混合脚本文件是不工作的混合减档。

**更新28-3-2015 **

似乎是我的问题没有解决。 当我做:

elixir.config.assetsDir = 'resources/frontend/';
mix.less('frontend.less');

elixir.config.assetsDir = 'resources/backend/';
mix.less('backend.less');

只有最后一个(后端)被执行。 当我把最后两行注释中的第一个(前端)被执行。 这是确定的,因为现在的后端的风格不应该经常改变,但是这将是非常不错的多少文件从多个资源文件夹到多个目标文件夹混合。

Answer 1:

尝试:

elixir(function(mix) {
    mix.less([
        'frontend/frontend.less',
        'backend/backend.less'
    ], null, './resources');
});


Answer 2:

相反,你的变种:

elixir(function(mix) {
    elixir.config.assetsDir = 'resources/frontend/';
    mix.less('frontend.less');

    elixir.config.assetsDir = 'resources/backend/';
    mix.less('backend.less');
});

试试这个代码:

elixir.config.assetsDir = 'resources/frontend/';
elixir(function(mix) {
    mix.less('frontend.less');
});

elixir.config.assetsDir = 'resources/backend/';
elixir(function(mix) {
    mix.less('backend.less');
});


Answer 3:

我一直在玩弄这几天,我已经找到了最好的选择到目前为止如下。

首先留在默认位置的资源文件,所以少看文件资源/资产/更少 。 然后将文件分成您的前端和后端资源在特定的资源文件夹中添加子文件夹,像这样,

resources/assets/less/frontend/frontend.less
resources/assets/less/backend/backend.less

现在,调用每一个像这样..

    mix.less('frontend/frontend.less', 'public/css/frontend/frontend.css');
    mix.less('backend/backend.less', 'public/css/backend/backend.css');

提供给每个mix.less的第二个参数可以指向你需要的地方来。

你不能在资源根直接的最高水平分割,但仍允许一些分离,一切都一饮而尽编译。



Answer 4:

我已经找到了以下工作:

elixir(function (mix) {

    mix
      .less(['app.less'], 'public/css/app.css')
      .less(['bootstrap.less'], 'public/css/bootstrap.css');

});

关键的事情需要注意:

  • 提供目标文件名,即写作public/css/ app.css ,而不是public/css/
  • .less调用,而不是使两个单独的mix.less()调用

对我的作品与laravel-灵药版本3.4.2



文章来源: Laravel Elixir Gulp mix two separate less files