Hola a todos estoy intentado realizar que muestre las fuentes Ubuntu, sin embargo no se muestran. ¿Alguien podría ayudarme? Por alguna r...

Jaime Iván Muñoz Enriquez

Jaime Iván Muñoz Enriquez

Pregunta
studenthace 4 años

Hola a todos estoy intentado realizar que muestre las fuentes Ubuntu, sin embargo no se muestran.

¿Alguien podría ayudarme?

Screenshot_6.png

Por alguna razón me los copia también en la carpeta de imágenes

Screenshot_7.png El archivo css generado por webpack va a traer los fonts desde assets/images/[hash], cosa que no debería porque existe la carpeta fonts

Screenshot_8.png

Adjunto mi link de github.

https://github.com/Jaime200/js-portafolio

de antemano muchas gracias

6 respuestas
para escribir tu comentario
    Kenneth Angulo L

    Kenneth Angulo L

    studenthace 3 años

    Revisar 3 cosas en el archivo webpackconfig.js

    1. QUe el output sea correcto:
    output: { path: path.resolve(__dirname, "dist"), filename: "[name][contenthash].js", assetModuleFilename: "assets/[hash][ext]", clean: true, },

    Especificamente esta linea, le dice al webpack donde generara los assets:

    assetModuleFilename: "assets/[hash][ext]",
    1. En la seccion de modulos, que cada regla este bien configurada:
    { test: /\.(woff|woff2|eot|ttf|otf)$/i, type: "asset/resource", generator: { filename: "assets/fonts/[hash][ext]", }, },

    Especificamente esta linea, le dice al webpack en que carpeta dentro los assets pondra los recursos de las fuentes:

    generator: { filename: "assets/fonts/[hash][ext]", },
    1. y finalmente que los plugins esten bien configurados, asi:

    Este en la seccion plugnis:

    new MiniCssExtractPlugin({ filename: "[name][contenthash].css", }),

    y al final la optimizacion este correcta:

    optimization: { minimize: true, minimizer: [new CssMinimizerPlugin(), new TerserPlugin()], },

    };

    Luis Ortiz

    Luis Ortiz

    studenthace 3 años

    Me pasa lo mismo y literalmente copie y pegue el webpack.config.js de los archivos y el main.css

    Juan Miguel Garcia Carballo

    Juan Miguel Garcia Carballo

    studenthace 4 años

    Muchas gracias @jmunos200, tenia el mismo error y gracias a las modificaciones esas lo pude solucionar

    Dámaris Raquel Terrazas Terán

    Dámaris Raquel Terrazas Terán

    studenthace 4 años

    Me pasa lo mismo y no encuentro una solución viable

    Jaime Isaí Orellana Mejia

    Jaime Isaí Orellana Mejia

    studenthace 4 años

    Yo tengo el mismo error

Curso de Webpack [Empieza Gratis]

Curso de Webpack [Empieza Gratis]

Construye aplicaciones React usando Webpack. Aprende a configurar y optimizar tu entorno de desarrollo con loaders, compresión CSS y análisis de paquetes. Despliega tu proyecto fácilmente en producción y mejora el rendimiento.

Curso de Webpack [Empieza Gratis]
Curso de Webpack [Empieza Gratis]

Curso de Webpack [Empieza Gratis]

Construye aplicaciones React usando Webpack. Aprende a configurar y optimizar tu entorno de desarrollo con loaders, compresión CSS y análisis de paquetes. Despliega tu proyecto fácilmente en producción y mejora el rendimiento.