Javascript正規マッチングにはサブストリングは含まれません

問題の再現

皆さんはwebpackの使用中に、次のような問題に遭遇したことがありますか.

はcss Moduleを使用した場合、同時にいくつかのglobalのレイアウトを使用することを望んでいるが、実際にはcss Moduleで直接

を使用している.

:global(.title) {
    color: green;
}

実装も可能であるが、Animate.cssのようなサードパーティcssを導入する必要がある場合、各classnameに対して手動でグローバル定義を行う場合、ワークロードは小さくない.

cssのパッケージングの問題については、一部のコンポーネントのスタイルについては、cssをjsファイルにパッケージングすることができるが、一部のグローバルなcssや、最初の時間にロードする必要があるcss(例えばpace.cssは、ページロード中に最初の時間でスタイルを解析する必要がある)があり、ExtractTextPluginを使用して単独のcssファイルにパッケージングする必要がある.

以上は、同じタイプのファイルに対する異なる処理が必要である.webpackでは、正規表現でファイル名マッチングを行うように表現されている.
より優雅なネーミングのために、第1のシナリオを例に挙げると、グローバルなスタイルファイルをfoo.global.lessと命名し、他のcss module処理が必要な場合は、bar.lessのように正常にネーミングします.

構想

トピックに入る前に、Javascriptだけでなく、*.global.lessの正則を含む実用的なオンライン正則サイトrefiddleを共有します.
次のメインイベントは、*.lessと*.global.lessをどのように正則的にマッチングしますか?
よく知られているように、webpackには複数回の正規一致は存在しないため、上記の2つの文字列の一致を解決するためにそれぞれ2つの正規表現を使用する必要がある.*.global.less文字列マッチング?はい、so easy,/\.global\.less$/,では*.less(*.global.lessを含まない)は?
明らかに、これは正則的な位置マッチング((^\.global)および[^\.global]が正しくない)を使用する必要があり、マッチングの前に.globalの位置ではない.
ぶんかつ
構文
説明
キャプチャ(exp)
expに一致し、自動的に命名されたグループにテキストをキャプチャします.
キャプチャ(?exp)
expに一致し、名前がnameのグループにテキストをキャプチャし、(?'name'exp)と書くこともできます.
キャプチャ(?:exp)
一致exp、一致するテキストを取得せず、このパケットにグループ番号を割り当てない
位置照合(?=exp)
expの前の位置に一致
位置照合(?<=exp)
expの後ろの位置に一致
位置照合(?!exp)
後ろに付いているexpではない位置に一致します
位置照合(?
前のexpでない位置に一致
コメント(?#comment)
このタイプのグループ化は、正規表現の処理に影響を及ぼさず、注釈を提供して読ませるために使用されます.
上記の表のように、(?， /(?， ！を する があることは らかです.
でも! にこれでいいの?? ながらjsでは(?<=exp)と(? 。（ Js ， ， , ? ）
RegExp.は していません
と の を て、Jsにはある が まれていない マッチング/^(.(?!\.global))+\.less$/が られた.(?!\.global) するのは ろが.globalではない (.(?!\.global))+ するのはいくつかの ろが.globalではない ^ではない の の を うことはできません!もしなくなったら、/(.(?!\.global))+\.less$/もfoo.global.lessに することができます.fooの ろの.から、 ろについているのは.globalではありませんから.
しかし、.global.less については、この もどうしようもない.

リファレンス

30 チュートリアル

JavaScript RegExp

は「ある を まない」( かりやすく もある!)