feat(vue-app): build indicator

[pi0]

Types of changes

• Bug fix (a non-breaking change which fixes an issue)
• New feature (a non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)

Description

Show build progress inside pages!

TODO

• improve style
• support custom base URL
• add an option to optionally disable
• wait little more to display progress of 100

Checklist:

• My change requires a change to the documentation.
• I have updated the documentation accordingly. (PR: version: v2.8.0 docs#1421)
• I have added tests to cover my changes (if not applicable, please state why)
• All new and existing tests are passing.

[codecov-io]

Codecov Report

Merging #5820 into dev will not change coverage.
The diff coverage is n/a.

@@           Coverage Diff           @@
##              dev    #5820   +/-   ##
=======================================
  Coverage   95.68%   95.68%           
=======================================
  Files          82       82           
  Lines        2687     2687           
  Branches      689      689           
=======================================
  Hits         2571     2571           
  Misses         98       98           
  Partials       18       18

Flag	Coverage Δ
#e2e	100% <ø> (ø)	⬆️
#fixtures	50.42% <ø> (ø)	⬆️
#unit	92.66% <ø> (ø)	⬆️

Impacted Files	Coverage Δ
packages/vue-app/src/index.js	0% <ø> (ø)	⬆️
packages/config/src/config/build.js	100% <ø> (ø)	⬆️
packages/builder/src/context/template.js	100% <ø> (ø)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update e161d70...55a1ead. Read the comment docs.

[Atinux]

Awesome work Pooya!
Will do some small changes for the UI and will be good for me :)

[Atinux]

My last commit improves the style and uses $nextTick to show 100% everytime it's built.

[Atinux]

I added the build.indicator: false option (true by default).

Test and documentation updates are needed now.

About option name, do we agree on build.indicator?

[kevinmarrec]

Awesome work guys :) !

@Atinux I'm fine with build.indicator, unless we decide it needs more context.

[Atinux]

UI changes to show only Nuxt logo + percent:

[pi0]

Updates:

• Added name to component and renamed to buildIndicator
• Smooth progress animation between updates
• No more div wrapping

order is changed

[Atinux]

Final GIF