Я не знаю, как заставить шрифт работать с веб-пакетом - PullRequest
0 голосов
/ 30 марта 2020

enter image description here

Я пытался использовать загрузчик файлов, но он не работает

import { completeToDo } from './app2'
import { removeToDo } from './app2'

import './css/font-awesome.css'
import './css/style.scss'


export {
    completeToDo,
    removeToDo
}
@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.7.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
<head>
    <meta charset="UTF-8">
    <title>JavaScript - To Do List</title>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Titillium+Web">
    <link rel="stylesheet" href="css/font-awesome.css">
    
</head>

и вот ссылка на мой проект: https://www.dropbox.com/sh/h3tow5d4jfmb5sb/AADVyEX1vWpvJuBI3ZLZmr5Wa?dl=0

, то есть мой webpack.config. js

 const path = require('path')
const webpack = require('webpack')
const HtmlWebPackPlugin = require("html-webpack-plugin")
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const WorkboxPlugin = require('workbox-webpack-plugin')
module.exports = {
    entry: "./src/js/index.js",
    mode: 'production',
    output: {
        libraryTarget: 'var',
        library: 'Client'
    },
    module: {
        rules: [
            {
                test: '/\.js$/',
                exclude: /node_modules/,
                loader: "babel-loader"
            },
            {
                test:  /\.(png|woff|woff2|eot|ttf|svg)$/,
                use: [ MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader' ]
            },
            {
                test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
                use: [{
                    loader: 'file-loader',
                    options: {
                      name: '[name].[ext]',
                      outputPath: 'fonts/'
                    }
                }]
             }
        ],  
    },   
    plugins: [
        new HtmlWebPackPlugin({
            template: "./src/index.html",
            filename: "./index.html",
        }),
        new MiniCssExtractPlugin({filename: '[name].css'}),
        new WorkboxPlugin.GenerateSW()
    ]
}

Я пытаюсь использовать загрузчик файлов для загрузки шрифтов и изображений, но кажется, что в моих шагах чего-то не хватает, есть идеи, что делать, а чего нет?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...