2017-01-29 47 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 
    } 
}