получить веб-пакет для включения HTML-файлов

1

Примечание. Я начинаю пользоваться webpack.

Я пытаюсь загрузить webpack файлы.htmls(index.html и login.html), поскольку они будут служить в качестве окон для моего электронного приложения. Это то, что я пробовал до сих пор без каких-либо результатов:

rules: [
            {
                test: /\.html$/,
                use: ["html-loader"]
            },
...

а также

rules: [
            {
                test: /\.html$/,
                loader: "file-loader"
            },
...

Это мой файл webpack.config.js:

const path = require("path");
const { spawn } = require("child_process");

const srcDir = path.resolve(__dirname, "src/renderer");
const outDir = path.resolve(__dirname, "build/client");

const defaultIncludes = [srcDir];

module.exports = {
    entry: '${srcDir}/index',

    output: {
        path: outDir,
        filename: "app.bundle.js"
    },

    resolve: {
        extensions: [".ts", ".tsx", ".js", ".json", ".html"]
    },

    module: {
        rules: [
            {
                test: /\.html$/,
                loader: "file-loader"
            },
            {
                // Include ts, tsx, and js files.
                test: /\.(tsx?)|(js)$/,
                exclude: /node_modules/,
                loader: "babel-loader",
                include: defaultIncludes
            },
            {
                test: /\.scss$/,
                use: [
                    "style-loader", // creates style nodes from JS strings
                    "css-loader", // translates CSS into CommonJS
                    "sass-loader" // compiles Sass to CSS
                ]
            },
            {
                test: /\.(ttf|eot|woff|woff2)$/,
                loader: "file-loader",
                options: {
                    name: "fonts/[name].[ext]"
                }
            }
        ]
    },

    devServer: {
        inline: true,
        contentBase: outDir,
        compress: true,

        stats: {
            colors: true,
            chunks: false,
            children: false
        },

        before() {
            spawn("electron", ["."], {
                shell: true,
                env: process.env,
                stdio: "inherit"
            }).on("close", code => process.exit(0)).on("error", spawnError => console.error(spawnError));
        }
    },

    target: "electron-renderer",
    mode: "development"
};

Что я делаю неправильно? Webpack создает все в /build но файлы.html(index.html и login.html, которые находятся в моем каталоге /src/), не включены.

Теги:
webpack
electron

1 ответ

2
Лучший ответ

Конфигурация загрузчика для файлов HTML позволяет require вызовы с HTML файлами работали внутри файлов javascript. С загрузчиком файлов вы получите путь к файлу и с загрузчиком HTML вы получите содержимое HTML в результате вызова.

Если вы хотите, чтобы ваши файлы HTML были скопированы вместе с вашими скомпилированными источниками, вам нужно будет использовать плагин, такой как copy-webpack-plugin или html-webpack-plugin.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню