Conversation
- Upgrade dependencies to Vue 3, vue-loader 17, element-plus and vue-i18n in package.json - Update public HTML files to use Vue 3 and Element Plus CDN builds. - Keep el-switch height as 20px to match previous design from Element UI. - Migrate app bootstrap to Vue 3 API: use createApp and createI18n in src/main.js and register ElementPlus. - Replace vue-scrollactive with a new in-house ScrollSpy component - Auto formatting by prettier. - Update build config to import VueLoaderPlugin from 'vue-loader'.
- Updated example prop to use defineProps as destructured reactive prop - Use store as reactive entity
- Use useTemplateRef for left container - Use store as reactive shared state. - Initialize LazyLoad as a ref and update lazy-loading logic accordingly.
- Update i18n $t with t - Change Element plus mini size to small as mini is removed - Pass raw store via vue toRaw to fix clone issue with proxy objects as store is reactive
… modernize template
0db3c7d to
fab40a4
Compare
- When moving from element-ui to element plus, we lost the built-in icon font. Element plus has icon library which is Vue specific. To avoid dependency, we are switching to an SVG sprite approach for icons as we only need a few icons. - Integrate an in-house SvgSpritePlugin into build/webpack.config.js - Special handling for svg icons loading (include iconDir, support ?inline) - Add UI icon SVGs in use - update components to use sprite <svg><use href="/asset/sprite.svg#...">
|
Turns out the build process is a bit different. Examples are copied to website but the HTML and some dependency come from apache/echarts-www After building Getting syntax error from below code of vue-i18n : Another non-blocker issue is that SVGs are being duplicated in final build. |
- VueI18n raises ReferenceError: __VUE_PROD_DEVTOOLS__ is not defined in production build - Add missing ElementPlus import in main as we now use it as devDependency
69471b0 to
2b33f59
Compare
- Migrate all SVGs to be compiled into a sprite and used via <use> tags with symbol IDs. - Add utility CSS classes for consistent SVG styling, addressing <use> shadow DOM behavior. - Refactor Sidebar SVGs to use the sprite-based approach instead of CommonJS require. - Move inline SVGs to separate files in the icon/ui folder for better organization.
|
Documentation vue upgrade - apache/echarts-doc#486 |
Uh oh!
There was an error while loading. Please reload this page.