Gathering detailed insights and metrics for vue-hot-reload-api
Gathering detailed insights and metrics for vue-hot-reload-api
Gathering detailed insights and metrics for vue-hot-reload-api
Gathering detailed insights and metrics for vue-hot-reload-api
npm install vue-hot-reload-api
99.3
Supply Chain
86.2
Quality
78.3
Maintenance
100
Vulnerability
100
License
Module System
Min. Node Version
Typescript Support
Node Version
NPM Version
466 Stars
78 Commits
51 Forks
17 Watching
13 Branches
78 Contributors
Updated on 21 Mar 2024
Minified
Minified + Gzipped
JavaScript (100%)
Cumulative downloads
Total Downloads
Last day
-10.4%
271,382
Compared to previous day
Last week
-1%
1,398,162
Compared to previous week
Last month
16.5%
5,925,453
Compared to previous month
Last year
-20%
70,347,584
Compared to previous year
Note:
vue-hot-reload-api@2.x
only works withvue@2.x
Hot reload API for Vue components. This is what vue-loader and vueify use under the hood.
You will only be using this if you are writing some build toolchain based on Vue components. For normal application usage, just use vue-loader
or vueify
.
1// define a component as an options object
2const myComponentOptions = {
3 data () { ... },
4 created () { ... },
5 render () { ... }
6}
7
8// assuming Webpack's HMR API.
9// https://webpack.js.org/guides/hot-module-replacement/
10if (module.hot) {
11 const api = require('vue-hot-reload-api')
12 const Vue = require('vue')
13
14 // make the API aware of the Vue that you are using.
15 // also checks compatibility.
16 api.install(Vue)
17
18 // compatibility can be checked via api.compatible after installation
19 if (!api.compatible) {
20 throw new Error('vue-hot-reload-api is not compatible with the version of Vue you are using.')
21 }
22
23 // indicate this module can be hot-reloaded
24 module.hot.accept()
25
26 if (!module.hot.data) {
27 // for each component option object to be hot-reloaded,
28 // you need to create a record for it with a unique id.
29 // do this once on startup.
30 api.createRecord('very-unique-id', myComponentOptions)
31 } else {
32 // if a component has only its template or render function changed,
33 // you can force a re-render for all its active instances without
34 // destroying/re-creating them. This keeps all current app state intact.
35 api.rerender('very-unique-id', myComponentOptions)
36
37 // --- OR ---
38
39 // if a component has non-template/render options changed,
40 // it needs to be fully reloaded. This will destroy and re-create all its
41 // active instances (and their children).
42 api.reload('very-unique-id', myComponentOptions)
43 }
44}
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
license file detected
Details
Reason
Found 8/29 approved changesets -- score normalized to 2
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
Reason
project is not fuzzed
Details
Reason
branch protection not enabled on development/release branches
Details
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
Reason
41 existing vulnerabilities detected
Details
Score
Last Scanned on 2024-11-18
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn Morevue-loader
> webpack loader for Vue Single-File Components
@vue/compiler-sfc
@vue/compiler-sfc
use-hot-module-reload
React hook that triggers a callback after hot-module reloading has been performed (for any module, not just the one it was used in)
react-hot-api
A generic library implementing hot reload for React components without unmounting or losing their state.