私のless sourceMapファイルには「grunt」を実行したときに「ファイル」がありません

Question

lessc --source-map=styles.map assets/less/00_style.less dest/assets/prod.cssをコマンドラインで実行すると、すべてが機能しています。私はgrunt lessを実行すると、styles.mapは、「ファイル」の部分が欠落してばかりで終わっている、しかし

...AV2rEF;EAAiB,aAAA","file":"dest/assets/prod.css"} 

：：これはからSourceMapを停止

...AV2rEF;EAAiB,aAAA"} 

styles.mapファイルがで終わりますワーキング。何がうまくいかないでしょうか？次のように私の小さい設定は次のとおりです。

less: { 
    dist: { 
     options: { 
      sourceMap: true, 
      sourceMapFilename: 'styles.map' 
     }, 
     files: [{ 
      src : 'assets/less/00_style.less', 
      dest: 'dest/assets/prod.css' 
     }] 
    } 
} 

Answer 1

短い答え：

Gruntfile.jsであなたのlessタスクに次の追加のオプションを追加します。

... 
options: { 
    ... 
    sourceMapURL: '../../styles.map' 
}, 
... 

---

長い答え：

0 、CLI経由で（あなたの例のように） をlesscコマンドを実行し、予告次のコメントが生じた prod.cssに書き込まれ

：

/*# sourceMappingURL=../../styles.map */ 

しかし、gruntタスクを実行する際に、（使用あなたの現在の設定）、次のコメントは、結果prod.cssに書き込まれます。

/*# sourceMappingURL=styles.map */ 

は行方不明01を注意してください- そのためprod.cssはgrunt経由で実行すると、あなたのSourceMapがstyles.mapで行方不明"file:"で行うことがあまり働いていないされていない理由ですstyles.map

を見つけることができません。 .cssファイルは最終的に.mapファイルを指しています - その逆もありません。

lesscコマンドをCLIで実行した後でも、部分をstyles.mapから削除しても、SourceMapはブラウザで引き続き使用できます。ファイル.mapに含まれているかどうかにかかわらず、"file:"の部分は、SourceMapの動作を妨げないことを示します。最も最近提案SourceMap spec（V.3）で述べたよう

また、"file:"部分は任意である。

3行目：このソースマップが関連付けられていることを、生成されたコードの任意名と。

は、明示的に使用すると、複数の.lessファイルを使用する予定がある場合はご面倒なタスクのオプションでsourceMapURLがdest/assets/ディレクトリの中にフラットなフォルダ構造を維持することを必然的に伴うであろう定義します。（つまり、結果として得られる.cssファイルはサブフォルダに保存しないでください）