Laravel gulp 缺少 css 源映射文件答案

【问题标题】：Laravel gulp missing css source maps filesLaravel gulp 缺少 css 源映射文件
【发布时间】：2017-12-29 15:00:30
【问题描述】：

没有生成 CSS 源映射。而 JS 源映射生成良好，没有任何错误。我的 laravel 版本是5.1

我也在下面尝试了这段代码。即使它不起作用

elixir.config.sourcemaps = true;

gulpfile.js

/**
 * Global CSS MIX
 */
elixir(function(mix) {
    mix.styles([
        "user/common.css",
        "user/custom.css",
        "user/font-awesome.min.css",
    ], 'public/assets/css/builds/global.css');
});

/**
 * Global JS MIX
 */
elixir(function(mix) {
    mix.scripts([
        "angular/angular.min.js",
        "angular/angular-animate.js",
        "angular/angular-sanitize.min.js",
        "user/chat.js"
    ], 'public/assets/js/builds/global.js');
});

目录结构

resources/
├── assets
│   ├── css
│   │   └── user
│   │       ├── common.css
│   │       ├── custom.css
│   │       ├── font-awesome.min.css
│   ├── js
│   │   └── angular
│   │       ├── angular.min.js
│   │       ├── angular-animate.js
│   │       ├── angular-sanitize.min.js
│   │   └── user
│   │       ├── chat.js

【问题讨论】：

请说明您遇到的什么类型的问题。
CSS 源映射没有生成
您能运行npm list 并检查当前安装的elixir 版本吗？因为 stated in the docs 默认情况下，源映射是在 Larvel 5.1 附带的 Elixir 中生成的。
@Kovah laravel-elixir@3.4.3
尝试删除 node_modules 目录并再次运行 npm install

标签： laravel gulp source-maps laravel-elixir

【解决方案1】：

您是否尝试过使用 sourceMaps()？

elixir(function(mix) {
    mix.styles([
            "user/common.css",
            "user/custom.css",
            "user/font-awesome.min.css",
        ], 'public/assets/css/builds/global.css')
        .sourceMaps();
    }
);

【讨论】：

感谢您的回答。是的，我试过但它不起作用。控制台报错“TypeError: mix.styles(...).sourceMaps is not a function”

【解决方案2】：

您可以在 gulpfile.js 的顶部添加以下内容：

elixir.config.sourcemaps = false; //for live version
// elixir.config.sourcemaps = true; //for dev version

不确定它是否能解决您的具体问题，但在我遇到相同错误的几个项目中，这有帮助。（注意 laravel 5.0 - 5.2 max）

【讨论】：

【解决方案3】：

我不知道问题出在哪里。但升级到laravel-elixir@^4.0.0 可以解决我的类似问题

【讨论】：