Vue公司-CLI的WebPack模板無法正常提供靜態字體

在我的配置/ index.js，在構建部分，我有一個從內node_modules進口應該再一個主題模板來Vue公司-CLI的WebPack模板無法正常提供靜態字體

assetsSubDirectory: 'static', 
assetsPublicPath: '/path/to/subdirectory/',

我的靜態字體查看root/path/to /子目錄/ static/fonts/some-fonts.woff。它是否正確？

然而，在我的生產建設，構建以尋找那些文件：

根/靜態/字體/一些-fonts.wff

我不太文件樣本：

@font-face { 
     font-family: 'Source Sans Pro'; 
     font-style: normal; 
     font-weight: 300; 
     src: local('Source Sans Pro'), 
     url(/static/fonts/source-sans-pro/source-sans-pro-v9-vietnamese_latin-ext_latin-300.eot) format('embedded-opentype'), 
     url(/static/fonts/source-sans-pro/source-sans-pro-v9-vietnamese_latin-ext_latin-300.ttf) format('truetype'), 
     url(/static/fonts/source-sans-pro/source-sans-pro-v9-vietnamese_latin-ext_latin-300.woff) format('woff'), 
     url(/static/fonts/source-sans-pro/source-sans-pro-v9-vietnamese_latin-ext_latin-300.woff2) format('woff2'); 
    }

我該如何解決這個問題？

來源

2017-10-16 Kay Singian

字體位置不是問題;如果它在您的開發環境中工作，那麼字體文件將從node_modules加載，就像您躲過的一樣。

問題是與CSS加載器; read their docs here。 public路徑必須僅爲'/'，'static'將包含'字體'作爲構建中的子目錄。我有類似的問題，這解決了它。如果您嘗試爲公共路徑（例如，空字符串）做'/'以外的其他操作，那麼您將打破vue-cli模板的處理方式。

這就是區別 - 你沒有做「webpack」，你可以自由設定你想要的任何東西。憑藉vue-cli，你正在接受配置事物的「他們的方式」（我不是在敲）。如果您需要更多的自由來進行自定義配置，請考慮不帶vue-cli的webpack。

無論如何，請確保您正在觸摸開發者並在index.js中創建屬性貼圖;這些PATH變量會針對每個環境重複執行，有時編碼人員不記得向下滾動到「構建」屬性並更改這些PATH值。

來源

2017-12-13 09:04:11

Vue公司-CLI的WebPack模板無法正常提供靜態字體

回答

相關問題