HMR error: Cannot access '...' before initialization
See original GitHub issueDescribe the bug
The error happens when I try to edit component, that
- Wrap in
connect
function (redux) - Is inside dependency loop
- There is another component inside dependency loop
Seems weird, but it’s not so rare case when project uses routers like UiRouter or Universal router
I expect that component will be updated with HMR without errors or may be reload the page but not to throw an error
Reproduction
Repo: https://github.com/xSorc/test-vite-fast-refresh-loop-dependency
To reproduce this error you need to open the project and try to edit Component.tsx
. You will see an error
System Info
Output of npx envinfo --system --npmPackages vite,@vitejs/plugin-vue --binaries --browsers
:
System:
OS: Windows 10 10.0.19042
CPU: (6) x64 Intel(R) Core(TM) i5-8600K CPU @ 3.60GHz
Memory: 8.19 GB / 15.94 GB
Binaries:
Node: 14.15.3 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.10 - ~\AppData\Roaming\npm\yarn.CMD
npm: 6.14.9 - C:\Program Files\nodejs\npm.CMD
Browsers:
Edge: Spartan (44.19041.423.0), Chromium (89.0.774.77)
Internet Explorer: 11.0.19041.1
npmPackages:
vite: ^2.1.5 => 2.1.5
Used package manager:
Logs
Before submitting the issue, please make sure you do the following
- Read the Contributing Guidelines.
- Read the docs.
- Check that there isn’t already an issue that reports the same bug to avoid creating a duplicate.
- Provide a description in this issue that describes the bug.
- Make sure this is a Vite issue and not a framework-specific issue. For example, if it’s a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/vue-next instead.
- Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
Issue Analytics
- State:
- Created 2 years ago
- Reactions:38
- Comments:50 (9 by maintainers)
Top Results From Across the Web
How to debug "Cannot access X before initialization" errors?
For anyone getting here, I found this solution and it worked for me. Basically this error has two main reasons.
Read more >ReferenceError: can't access lexical declaration 'X' before ...
A lexical variable was accessed before it was initialized. This happens within any block statement, when variables declared with let or const ...
Read more >cannot access before initialization webpack - You.com | The AI ...
It only gives an error with native modules no matter if the export is a function or number. This is because, as the...
Read more >Vite HMR error: Cannot access '...' before initialization
网络基于axios实例封装了一个类。 每个模块的请求都继承这个基类。 只要涉及请求的代码进行保存时, vite hmr 会失效报错,只能强刷看更新。线上无此问题 ...
Read more >vite HMR error: Cannot access '...' before initialization
vite HMR error: Cannot access '...' before initialization · “相关推荐”对你有帮助么? · 热门文章 · 最新评论 · 您愿意向朋友推荐“博客详情页”吗? · 最新 ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
For future travelers: If you see the
ReferenceError: Cannot access (…) before initialization
error then you may have circular dependencies that need to be resolved. Discover them with a tool like Madge:madge --circular <path>
still have this problem on
vite@3.2.0