single-spa-vue - npm Package Compare versions

Comparing version 1.4.0 to 1.5.0

lib/single-spa-vue.js

@@ -91,2 +91,13 @@ (function (global, factory) {
 
+      if (!otherOptions.el) {
+        var htmlId = 'single-spa-application:' + props.name;
+        otherOptions.el = '#' + htmlId;
+        var domEl = document.getElementById(htmlId);
+        if (!domEl) {
+          domEl = document.createElement('div');
+          domEl.id = htmlId;
+          document.body.appendChild(domEl);
+        }
+      }
+
       if (!opts.appOptions.render && !opts.appOptions.template && opts.rootComponent) {
@@ -93,0 +104,0 @@ otherOptions.render = function (h) {

package.json

 {
   "name": "single-spa-vue",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "description": "a single-spa plugin for vue.js applications",
   "main": "lib/single-spa-vue.js",
   "scripts": {
-    "prepublish": "yarn build",
+    "prepublishOnly": "yarn build",
     "build": "rimraf lib && babel src --out-dir lib --source-maps"
@@ -16,4 +16,6 @@ },
     "lib",
-    "src"
+    "src",
+    "types"
   ],
+  "types": "types/single-spa-vue.d.ts",
   "keywords": [
@@ -20,0 +22,0 @@ "single-spa",

README.md

@@ -5,48 +5,2 @@ # single-spa-vuejs
 
-## Example
-In addition to this Readme, example usage of single-spa-vue can be found in the [single-spa-examples](https://github.com/CanopyTax/single-spa-examples/blob/master/src/vue/vue.app.js) project.
-
-## Quickstart
-
-First, in the [single-spa application](https://github.com/CanopyTax/single-spa/blob/master/docs/applications.md#registered-applications), run `npm install --save single-spa-vue`. Note you can also use
-single-spa-vue by adding `<script src="https://unpkg.com/single-spa-vue"></script>` to your html file and accessing the `singleSpaVue` global variable.
-
-Then, add the following to your application's entry file
-
-```js
-import Vue from 'vue';
-import singleSpaVue from 'single-spa-vue';
-import App from ./App.vue
-
-const vueLifecycles = singleSpaVue({
-  Vue,
-  appOptions: {
-    el: '#mount-location',
-    render: h => h(App),
-  }
-});
-
-export const bootstrap = [
-  vueLifecycles.bootstrap,
-];
-
-export const mount = [
-  vueLifecycles.mount,
-];
-
-export const unmount = [
-  vueLifecycles.unmount,
-];
-```
-
-## Options
-
-All options are passed to single-spa-vue via the `opts` parameter when calling `singleSpaVue(opts)`. The following options are available:
-
-- `Vue`: (required) The main Vue object, which is generally either exposed onto the window or is available via `require('vue')` `import Vue from 'vue'`.
-- `appOptions`: (required) An object which will be used to instantiate your Vue.js application. `appOptions` will pass directly through to `new Vue(appOptions)`
-- `loadRootComponent`: (optional and replaces `appOptions.render`) A promise that resolves with your root component. This is useful for lazy loading.
-
-## As a single-spa parcel
-To create a single-spa parcel, simply omit the `el` option from your appOptions, since the dom element will be specified by the user of the Parcel. Everything other
-option should be provided exactly the same as in the example above.
+[Full documentation](https://single-spa.js.org/docs/ecosystem-vue.html)

src/single-spa-vue.js

@@ -54,2 +54,13 @@ const defaultOpts = {
 
+      if (!otherOptions.el) {
+        const htmlId = `single-spa-application:${props.name}`
+        otherOptions.el = `#${htmlId}`
+        let domEl = document.getElementById(htmlId)
+        if (!domEl) {
+          domEl = document.createElement('div')
+          domEl.id = htmlId
+          document.body.appendChild(domEl)
+        }
+      }
+
       if (!opts.appOptions.render && !opts.appOptions.template && opts.rootComponent) {
@@ -56,0 +67,0 @@ otherOptions.render = (h) => h(opts.rootComponent)

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

15381

increased by1.17%

Number of package files

7

increased by16.67%

Lines of code

222

increased by18.09%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Number of lines in readme file

6

decreased by-88.46%

No dependency changes