2017-01-29 93 views
1

我正在使用Laravel 5.4和Laravel Mix來輸出SASS文件。Laravel Mix和SASS更改字體目錄

在我的字體定義中,我對它們進行了配置,以便在輸出CSS時它將指向諸如public/assets/fnt/font-name/filename.ext之類的文件,但處理器將更改輸出,以便它將指向public/fonts/filename.ext。有沒有辦法阻止它改變輸出路徑?

對我來說,默認情況下會做這樣的事情沒有意義。

編輯

我已經看到了他們正在使用混合的默認值是罪魁禍首:

module.exports.module = { 
    rules: [ 
     // ... 
     { 
      test: /\.(woff2?|ttf|eot|svg|otf)$/, 
      loader: 'file-loader', 
      options: { 
       name: 'fonts/[name].[ext]?[hash]', 
       publicPath: '/' 
      } 
     } 
    ] 
}; 

我一直在使用null-loader代替file-loader嘗試,但相反,它它會導致失敗是因爲它找不到node_modules中的文件,而這不是它應該首先查找的位置。

刪除有問題的結果規則中的錯誤的洪水從試圖打開並評估有問題的字體文件:

error in ./public/assets/fnt/fanfare-jf/fanfare-jf.ttf 

Module parse failed: DIRECTORY\public\assets\fnt\fanfare-jf\fanfare-jf.ttf Unexpected character '' (1:0) 
You may need an appropriate loader to handle this file type. 
(Source code omitted for this binary file) 

@ ./~/css-loader!./~/postcss-loader!./~/resolve-url-loader!./~/sass-loader?sourceMap&precision=8!./resources/assets/sass/app.scss 6:2525-2590 
@ ./resources/assets/sass/app.scss 
@ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss 

我至少可以增加emitFiles: falseoptions,以防止它製作的副本文件,但路徑仍在被修改。

+0

您是否想將此問題標記爲Webpack-2?處理加載器和選項的配置結構將會有很大不同。 – rxgx

+0

是的,這是正確的。 –

回答

0

由於您的配置,您獲得的輸出是預期的行爲。

您正在使用此配置文件加載文件:

 options: { 
      name: 'fonts/[name].[ext]?[hash]', 
      publicPath: '/' 
     } 

它說用publicPath爲public並創建一個文件名爲fonts/[name].[ext]?[hash]和的WebPack知道什麼這些符號'/', '.', '?'的名義做。

它只是尋找fonts目錄,如果沒有任何字體目錄,它會創建一個新目錄並將文件放入該目錄。

所以,你需要使用這個配置文件夾結構:

options: { 
    name: 'assets/fnt/font-name/[name].[ext]?[hash]', 
    publicPath: '/' 
} 

這應該爲您的配置工作。

更多file-loader配置:

https://github.com/webpack-contrib/file-loader#filename-templates

編輯:

由於Laravel Mix使用Webpack在它的背景和的WebPack沒有的字體文件的任何知識的時候沒有任何適當的裝載程序添加到配置。所以,錯誤:

Module parse failed: DIRECTORY\public\assets\fnt\fanfare-jf\fanfare-jf.ttf Unexpected character '' (1:0) 
You may need an appropriate loader to handle this file type. 

發生。

您需要告訴Webpack將字體加載到您所需的目錄,並且SASS文件中鏈接的字體將通過Webpack鏈接,無需任何其他配置。

+0

我列出的配置被Laravel Mix中的默認設置強加給我。我不希望它複製文件或任何東西_at all_。給定的配置導致它重新複製文件。我不在乎它想做什麼。我知道這些文件已存在於我提供的位置。我想讓它完全離開我。 –

+0

那麼,在我看來,你不想使用'Laravel Mix'? – PaladiN

+0

如果你將你的視圖定義爲「不想使用一個微小的組件意味着你根本不想使用整個事物」,那麼是的。在這種情況下,我從字面上花了整整10到23點30分,試圖讓它離開我的URL。 –

0

我結束了以下配置,至少讓它達到工作狀態。

{ 
    test: /\.(woff2?|ttf|eot|svg|otf)$/, 
    loader: 'file-loader', 
    options: { 
     name: '[path][name].[ext]?[hash]', 
     publicPath: '/', 
     context: 'public', 
     emitFile: false 
    } 
}