css - Symfony Webpack - 使用子目录中的自定义字体

Question

我在使用自定义字体文件编译 sass 文件时遇到问题。

我的目录结构是这样的:

app.scss文件内容:

@import '../../../libraries/SymfonyBundle/assets/css/helper';

helper.scss 文件内容:

@import "helpers/grid";
@import "helpers/colors";
@import "helpers/fonts";

fonts.scss 文件内容:

@font-face {
    font-family: "custom-font";
    src: url("../../fonts/custom-font.eot");
    font-weight: normal;
    font-style: normal;
}

自定义包文件位置:

/var/www/libraries/SymfonyBundle/assets/font/custom-font.eot

/var/www/libraries/SymfonyBundle/assets/css/helper.scss

/var/www/libraries/SymfonyBundle/assets/css/helpers/fonts.scss

我应该提供什么网址？我试过../../../../libraries/SymfonyBundle/assets/fonts/custom-font.eot(相对于网站构建目录)，../。 ./fonts/custom-font.eot(相对于库 scs 文件)。

但是我在运行 yarn run encore dev 命令时仍然遇到这个错误:

This relative module was not found:

* ../../../../libraries/SymfonyBundle/assets/font/custom-font.eot in ./node_modules/css-loader??ref--4-2!./node_modules/sass-loader/lib/loader.js??ref--4-3!./assets/css/app.scss`

webpack.config.js

var Encore = require('@symfony/webpack-encore');

Encore
    // the project directory where compiled assets will be stored
    .setOutputPath('public/build/')
    // the public path used by the web server to access the previous 
directory
    .setPublicPath('/build')
    .cleanupOutputBeforeBuild()
    .enableSourceMaps(!Encore.isProduction())
    // uncomment to create hashed filenames (e.g. app.abc123.css)
    .enableVersioning(Encore.isProduction())

    // uncomment to define the assets of the project
    .addEntry('js/app', './assets/js/app.js')
    .addStyleEntry('css/app', './assets/css/app.scss')

    // uncomment if you use Sass/SCSS files
    .enableSassLoader(function(sassOptions) {}, {
             resolveUrlLoader: false
    })

   // uncomment for legacy applications that require $/jQuery as a global 
variable
    .autoProvidejQuery()
;

module.exports = Encore.getWebpackConfig();

Answer 1

每当您运行 Encore 时，都会在您的 outputPath 目录中自动创建一个 manifest.json 文件。检查此文件中的路径。特别是斜线:和 setOutputPath 的值:./build/vs/buld vs build。

如果您的 Symfony 也位于子目录(如 http://dev.local/my-symfony-app/)中，这可能会很棘手。参见:Symfony official FAQ 中的这一段