Skip to content

Nothing is injected in the HTML #353

@k-vyn

Description

@k-vyn

Environment and package version

Webpack 5.70.0
HTML Inline Script Plugin 3.0.0

Reproduction link / code sample

It's a vanilla html file with some react.

  plugins: [
    new HtmlWebpackPlugin({
      template: './apps/figma/src/ui.html',
      filename: 'ui.html',
      chunks: ['ui'],
      inject: 'body',
    }),
    new HtmlInlineScriptPlugin({scriptMatchPattern: [/ui.tsx/]}),

    new CopyWebpackPlugin({
      patterns:[
        { from:path.resolve(__dirname, "./src/root"), to:"./"}
      ]
      })
  ],

Steps to reproduce

I'm running this with a build script inside a NX mono repo v13.9.2

What is expected?

<h2>Shape Creator</h2>
<p>Count: <input id="count" type="number" value="5"></p>
<button id="create">Create</button>
<button id="cancel">Cancel</button>
<script>

document.getElementById('create').onclick = () => {
  const textbox = document.getElementById('count');
  const count = parseInt(textbox.value, 10);
  parent.postMessage({ pluginMessage: { type: 'create-shapes', count } }, '*')
}

document.getElementById('cancel').onclick = () => {
  parent.postMessage({ pluginMessage: { type: 'cancel' } }, '*')
}

</script>

What is actually happening?

<!DOCTYPE html>
<html lang="en">
  <head><base href="/">
  </head>
  <body>
    <div id="react-page"></div>
  </body>
</html>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions