OfficeDev / OfficeDev/Office-Addin-TaskPane-React

react app bundle size issue

Open
#169 2 comments 0 reactions 1 assignee View on GitHub

@millerds is already working on this.

Since Nov 19, 2024.

Dominant language
TypeScript
Stars
89
Forks
46
Avg merge
1d 8h
Merged PRs (30d)
3

Description

Expected behavior

Build size should be reasonable for react app.

Current behavior

Using react/typescript template for task pane app. Npm run build produce large taskpane.js file

The following message is show in the console

WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
Entrypoints:
vendor (402 KiB)
vendor.js
taskpane (13.6 MiB)
taskpane.js

Webpack configuration may be incorrect.
It seems that it was at least partly fixed inside the template repo https://github.com/OfficeDev/Office-Addin-TaskPane-React?tab=readme-ov-file
but for some reason generator office uses older version of the template.

Steps to Reproduce

Please provide detailed steps for reproducing the issue.

  1. create react task pane app using generator (options: Office Add-in Task Pane project using React framework, Typescript)
  2. install dependancies
  3. build the app (npm run build)
  4. check file sizes

Context

  • Operating System: macOS
  • Node version: 22.11.0
  • Tool version: 2.0.3

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.