Webpack 2：不要在.less文件中編譯字體

Question

我試圖運行webpack 2（2.6.1），少用css編譯。 遇到字體問題 - 如果在.less文件中存在@ font-face，則會發生錯誤。

@charset "UTF-8"; 
@font-face { 
    font-family: 'Exo2Medium'; 
    src: url("./fonts/Exo2Medium/Exo2Medium.eot"); 
    src: local("�?�"), url("./fonts/Exo2Medium/Exo2Medium.woff") format("woff"), url("./fonts/Exo2Medium/Exo2Medium.otf") format("opentype"); 
} 

經過一番搜索我已經發現，能夠解決這樣的問題的解決方案：

module: { 
    rules: [ 
     { test: /\.tsx?$/, loader: "awesome-typescript-loader" }, 
     { enforce: "pre", test: /\.js$/, loader: "source-map-loader" }, 
     { 
      test: /\.less$/, 
      use: ExtractTextPlugin.extract({ 
       loader:[ 'css-loader', 'less-loader' ], 
       fallback: 'style-loader' 
      }) 
     }, 
     { 
      test: /\.(png|woff|woff2|eot|ttf|otf|svg)$/, loader: 'url-loader?limit=100000' 
     } 
    ] 
} 

但是，在這種情況下，所有的字體編譯成輸出.css文件。 是否有可能只保留.css鏈接到字體？

Answer 1

Webpack file-loader是您正在尋找的解決方案。