npmpackage.info

Gathering detailed insights and metrics for vue-safe-html

Other packages similar to vue-safe-html

vue-dompurify-html

5.3.0

Safe replacement for the v-html directive

vue-html-secure

1.0.10

Vue.js 2.x and 3.x plugin to add HTML secure directives v-html-remove, v-html-escape, v-html-safe

vue-safe-iframe

1.0.4

Safely include html in a iframe

mt-v-safe-html

4.0.0

A lightweight, flexible, and robust XSS sanitizer's Vue plugin based on DOMPurify

Gathering detailed insights and metrics for vue-safe-html

vue-safe-html - 3.0.1 | npmpackage.info

vue-safe-html

A Vue directive which renders sanitised HTML dynamically

3.0.1

NOASSERTION

JavaScript

770.00 B

1,101,800 3.6

Installations

npm install vue-safe-html

Developer Guide

BETA

Typescript

No

Module System

ESM

Node Version

18.17.1

NPM Version

9.6.7 Score

73.7

Supply Chain

94.2

Quality

79.5

Maintenance

100

Vulnerability

99.1

License

Pull Requests

Open

5

Total

117

Closed

31

Merged

81

Issues

Open

2

Total

17

Closed

15

Releases

v2.2.0

Updated on Nov 04, 2022

v2.1.0

Updated on Nov 03, 2022

v1.0.1

Updated on Jan 15, 2021

v1.0.0

Updated on Jan 15, 2021

View All 4 releases

Languages

JavaScript

JavaScript (100%)

Developer

ecosia

Download Statistics

Total Downloads

1,101,800

Last Day

722

Last Week

5,446

Last Month

23,504

Last Year

303,249

GitHub Statistics

NOASSERTION License

30 Stars

224 Commits

5 Forks

12 Watchers

6 Branches

13 Contributors

Updated on Feb 03, 2025

Bundle Size

1.48 kB

Minified

770.00 B

Minified + Gzipped

Bundlephobia

Maintainers

View All 13 Contributors

Package Meta Information

Latest Version

3.0.1

Package Id

vue-safe-html@3.0.1

Unpacked Size

20.08 kB

Size

7.59 kB

File Count

NPM Version

9.6.7

Node Version

18.17.1

Published on

Oct 18, 2023

Total Downloads

Cumulative downloads

Total Downloads

1,101,800

Last Day

342.9%

722

Compared to previous day

Last Week

8.9%

5,446

Compared to previous week

Last Month

-30.8%

23,504

Compared to previous month

Last Year

-45.3%

303,249

Compared to previous year

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dev Dependencies

@babel/core @babel/preset-env @vue/test-utils @vue/test-utils3 @babel/eslint-parser babel-jest babel-loader eslint eslint-config-airbnb-base eslint-plugin-compat eslint-plugin-import eslint-plugin-vue jest vue vue-template-compiler vue3 webpack webpack-cli

vue-safe-html

Node

A Vue directive which renders sanitised HTML dynamically. Zero dependencies, compatible with Vue versions 3 and 2, TypeScript-ready.

Note: This library is not XSS-safe, but only strips tags programmatically.

Installation

Install package:

1npm install vue-safe-html
2# OR
3yarn add vue-safe-html

Use the plugin:

1import Vue from 'vue';
2import VueSafeHTML from 'vue-safe-html';
3
4Vue.use(VueSafeHTML);

Usage

In your component:

1<template>
2  <div v-safe-html="myUnsafeHTML">
3</template>

1export default {
2  computed: {
3    myUnsafeHTML() {
4      return '<script>oh my!</script> I am safe!';
5    }
6  }
7}

Renders to:

1<div>I am safe!</div>

Options

allowedTags

Array of strings. Default: ['a', 'b', 'br', 'strong', 'i', 'em', 'mark', 'small', 'del', 'ins', 'sub', 'sup'].

Customize the tags that are allowed to be rendered, either by providing new ones:

1Vue.use(VueSafeHTML, {
2  allowedTags: ['marquee', 'blockquote'],
3});

Or extending the default ones:

1import VueSafeHTML, { allowedTags } from 'vue-safe-html';
2
3Vue.use(VueSafeHTML, {
4  allowedTags: [...allowedTags, 'marquee', 'blockquote'],
5});

If no tags are passed, all tags are stripped:

1import VueSafeHTML from 'vue-safe-html';
2
3Vue.use(VueSafeHTML, {
4  allowedTags: [],
5});

It is also possible to provide custom allowed tags directly to the directive tag, using directive modifiers. This allows local override of the option:

1<template>
2  <!-- only allow p and strong tags -->
3  <div v-safe-html.p.strong="myUnsafeHTML">
4</template>

allowedAttributes

Array of strings. Default: []

Customize the tag attributes that are allowed to be rendered:

1Vue.use(VueSafeHTML, {
2  allowedTags: ['a'],
3  allowedAttributes: ['title', 'class', 'href'],
4});
5
6### Nuxt
7
8`vue-safe-html` is written as a Vue plugin so you can easily use it inside Nuxt by following [the Nuxt documentation](https://nuxtjs.org/docs/2.x/directory-structure/plugins#vue-plugins).
9
10## License
11
12[Do No Harm](./LICENSE)

No vulnerabilities found.

10

Dangerous-Workflow

Determines if the project's GitHub Action workflows avoid dangerous patterns.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

9

License

Determines if the project has defined a license.

8

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

Token-Permissions

Determines if the project's workflows follow the principle of least privilege.

0

Maintained

Determines if the project is "actively maintained".

0

Security-Policy

Determines if the project has published a security policy.

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Pinned-Dependencies

Determines if the project has declared and pinned the dependencies of its build process.

0

Fuzzing

Determines if the project uses fuzzing.

0

SAST

Determines if the project uses static code analysis.

0

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

Score

3.6

/10

Last Scanned on 2025-05-05

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 More