0

Let's say I have a structure like:

- webpack.config.js
app/
  - index.ts
  - index.html

When I build I get this.

- webpack.config.js
dist/
  - index.js
  - index.js.map
app/
  - index.ts
  - index.html

But what I want is the index.html file copied into the dist folder as well without importing it in index.ts.

My loaders look like this:

module: {
  rules: [
    {
      test: /\.tsx?/,
      use: "ts-loader",
      exclude: /node_modules/,
    },
    {
      test: /\.(png|jpg|gif|html)$/i,
      type: "asset/resource",
    },
  ],
},

I would assume that the "asset/resource" declaration would make it so webpack assumes we need this asset, but I need to add an import "./index.html" in index.ts to get the file to copy as expected.

I know I can use this:

plugins: [
  new CopyPlugin({
    patterns: [
      {
        from: "*.html",
      },
    ],
  }),
],

Is there a way to get this file moved over without using plugins and without importing it in my .ts files? I would like to avoid using hacky solutions like doing a cp in npm as well.

- webpack.config.js
dist/
  - index.js
  - index.js.map
  - index.html
app/
  - index.ts
  - index.html
jscul
  • 748
  • 1
  • 10
  • 25

0 Answers0