typescript - 如何使用 Webpack 3、Typescript 和文件加载器加载 index.html 文件?

标签 typescript webpack webpack-file-loader webpack-3

我尝试通过 file-loader 和 Webpack 3 加载我的 index.html 文件。

我的webpack.config.ts看起来像这样:

import * as webpack from 'webpack';

const config: webpack.Configuration = {
    entry: "./src/app.tsx",
    output: {
        filename: "bundle.js",
        path: __dirname + "/dist"
    },

    devtool: "source-map",

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

    module: {
        rules: [
            {
                test: /\.tsx?$/,
                loader: "awesome-typescript-loader"
            }, {
                test: /\.html$/,
                loader: "file-loader"
            }
        ]
    }
};

export default config;

不幸的是,它没有将我的 src/index.html 文件加载到 dist 文件夹中。我究竟做错了什么?如何将src文件夹中的索引文件获取到dist文件夹中?

最佳答案

您可以使用html-webpack-plugin .

{
  plugins: [
    new HtmlWebpackPlugin({
      template: 'src/index.html'
    })
  ]
}

关于typescript - 如何使用 Webpack 3、Typescript 和文件加载器加载 index.html 文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44930804/

相关文章:

javascript - 将对象属性解构为数组值

typescript - 忽略捆绑的 .d.ts 并使用外部声明

typescript - 如何将excel文件中的值存储到数组中进行测试

vue.js - Vue Workbox Webpack "cannot use import statement outside a module"

javascript - webpack 文件加载器输出损坏的图像

reactjs - 在 react 导航 v5 上使用带有 useRoute 的 typescript

php - 无法获取 webpack-dev-server 代理和 watch 一起工作

javascript - 添加 JS 文件 - Webpack - 静态站点样板

webpack - 在 webpack 中使用文件加载器导入更少的文件

javascript - 找不到通过 Webpack 文件加载器加载的某些图像