notifystr

1.1.0 verified Fri May 01 auth: no javascript maintenance

A simple Vue.js 2.0+ notification/toaster component supporting module bundlers like webpack/rollup and SCSS. Currently at version 1.1.0 (no recent updates, single release). It provides four toast types (success, warning, danger, info) with configurable duration. Minimalistic compared to alternatives like vue-toastification or vue-notification, offering a lightweight solution without extra flags or advanced customization. The package requires manual SCSS compilation and has no active maintenance.

Common errors

error Vue.use is not a function ↓

cause Attempting Vue.use(notifystr) which is only for plugins.

fix

Use Vue.component('notifystr', notifystr) instead.

error this.$notifystr is undefined ↓

cause Component not registered or placed in template.

fix

error Cannot find module 'notifystr' ↓

cause Package not installed or not in node_modules.

fix

Run npm install notifystr --save and ensure it's in dependencies.

Warnings

gotcha notifystr is not a plugin; cannot use Vue.use(). Must register as a component. ↓

fix Use Vue.component('notifystr', notifystr) instead.

gotcha The component must be placed only once in the template; multiple instances cause duplicate toasts. ↓

fix Ensure only one <notifystr> tag exists in your app.

deprecated Only Vue 2.x is supported; no Vue 3 compatibility. ↓

fix Switch to a Vue 3 compatible notification library like vue-toastification.

breaking SCSS compilation is required; failure to include SCSS will result in missing styles. ↓

fix Ensure your build pipeline compiles SCSS files from node_modules.

Install

npm install notifystr

yarn add notifystr

pnpm add notifystr

Imports

notifystr

wrong

const notifystr = require('notifystr')

correct

import notifystr from 'notifystr'

Default import only; ESM-style import is required.

Vue.component
wrong
```
Vue.use(notifystr)
```
correct
```
Vue.component('notifystr', notifystr)
```
Plugins are not supported; use component registration.

$notifystr

wrong

this.$notifystr('success', title, message, duration)

correct

this.$notifystr.success(title, message, duration)

Method calls are on the instance, not a function.

Quickstart

Shows component registration and usage of $notifystr methods with toast types.

import Vue from 'vue';
import notifystr from 'notifystr';
Vue.component('notifystr', notifystr);

// In template: <notifystr></notifystr>

// Call anywhere:
this.$notifystr.success('Hello', 'World', 3000);
this.$notifystr.danger('Error', 'Something broke', 5000);