├── .gitignore ├── dist ├── vue-cryptojs.es5.d.ts ├── vue-cryptojs.min.d.ts ├── vue-cryptojs.min.js └── vue-cryptojs.es5.js ├── test └── index.mjs ├── gulpfile.js ├── LICENSE ├── src └── index.mjs ├── package.json └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules -------------------------------------------------------------------------------- /dist/vue-cryptojs.es5.d.ts: -------------------------------------------------------------------------------- 1 | import type { Plugin, App } from "vue" 2 | 3 | export = { 4 | install: (app: App) => Plugin['install'] 5 | } 6 | -------------------------------------------------------------------------------- /dist/vue-cryptojs.min.d.ts: -------------------------------------------------------------------------------- 1 | import type { Plugin, App } from "vue" 2 | 3 | export = { 4 | install: (app: App) => Plugin['install'] 5 | } 6 | -------------------------------------------------------------------------------- /test/index.mjs: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import VueCryptojs from '../src/index.mjs' 3 | 4 | Vue.use(VueCryptojs) 5 | 6 | const test = new Vue({ 7 | methods: { 8 | run() { 9 | Vue.CryptoJS.SHA256("Message").toString(); 10 | this.CryptoJS.SHA256("Message").toString(); 11 | this.$CryptoJS.SHA256("Message").toString(); 12 | } 13 | } 14 | }) 15 | 16 | test.run() 17 | -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | const gulp = require('gulp') 2 | const babel = require('gulp-babel') 3 | const uglify = require('gulp-uglify') 4 | const rename = require('gulp-rename') 5 | 6 | gulp.task('default', () => { 7 | return gulp.src('src/index.mjs') 8 | .pipe(babel({ 9 | presets: ['@babel/env'] 10 | })) 11 | .pipe(rename('vue-cryptojs.es5.js')) 12 | .pipe(gulp.dest('dist')) 13 | .pipe(uglify()) 14 | .pipe(rename('vue-cryptojs.min.js')) 15 | .pipe(gulp.dest('dist')) 16 | }) -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | AFL-2.0 2 | 3 | Copyright 2017 Yu-An Lin 4 | 5 | Licensed under the Apache License, Version 2.0 (the "License"); 6 | you may not use this file except in compliance with the License. 7 | You may obtain a copy of the License at 8 | 9 | http://www.apache.org/licenses/LICENSE-2.0 10 | 11 | Unless required by applicable law or agreed to in writing, software 12 | distributed under the License is distributed on an "AS IS" BASIS, 13 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 14 | See the License for the specific language governing permissions and 15 | limitations under the License. -------------------------------------------------------------------------------- /dist/vue-cryptojs.min.js: -------------------------------------------------------------------------------- 1 | "use strict";var _cryptoJs=_interopRequireDefault(require("crypto-js"));Object.defineProperty(exports,"__esModule",{value:!0}),exports["default"]=void 0;function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}/* eslint-disable */var VueCryptojs={install:function install(a){a.CryptoJS=_cryptoJs["default"],a.prototype&&Object.defineProperties(a.prototype,{$CryptoJS:{get:function get(){return _cryptoJs["default"]}},CryptoJS:{get:function get(){return _cryptoJs["default"]}}}),a.config&&a.config.globalProperties&&(a.config.globalProperties.$CryptoJS=_cryptoJs["default"]),a.provide&&"function"==typeof a.provide&&a.provide("cryptojs",_cryptoJs["default"]),"undefined"!=typeof window&&window.Vue&&window.Vue.use(VueCryptojs)}},_default=exports["default"]=VueCryptojs; 2 | -------------------------------------------------------------------------------- /src/index.mjs: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | import cryptojs from 'crypto-js' 3 | 4 | const VueCryptojs = { 5 | install (Vue, options) { 6 | Vue.CryptoJS = cryptojs 7 | 8 | // VueJS 2 9 | 10 | if (Vue.prototype) { 11 | Object.defineProperties(Vue.prototype, { 12 | $CryptoJS: { get() { return cryptojs } }, 13 | CryptoJS: { get() { return cryptojs } } 14 | }) 15 | } 16 | 17 | // VueJS 3 18 | 19 | if (Vue.config && Vue.config.globalProperties) { 20 | Vue.config.globalProperties.$CryptoJS = cryptojs 21 | } 22 | 23 | if (Vue.provide && typeof Vue.provide === 'function') { 24 | Vue.provide('cryptojs', cryptojs) 25 | } 26 | 27 | if (typeof window !== 'undefined' && window.Vue) { 28 | window.Vue.use(VueCryptojs) 29 | } 30 | } 31 | } 32 | 33 | export default VueCryptojs 34 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vue-cryptojs", 3 | "version": "2.4.7", 4 | "description": "A small wrapper for integrating crypto-js into VueJS", 5 | "main": "dist/vue-cryptojs.min.js", 6 | "scripts": { 7 | "test": "node --experimental-modules test/index.mjs", 8 | "build": "npx babel ./src/index.mjs --out-file ./dist/vue-cryptojs.es5.js --presets=@babel/env && npx babel ./src/index.mjs --out-file ./dist/vue-cryptojs.min.js --presets=@babel/env,minify" 9 | }, 10 | "keywords": [ 11 | "crypto", 12 | "crypto-js", 13 | "encrypt", 14 | "vue", 15 | "vuejs", 16 | "wrapper" 17 | ], 18 | "repository": { 19 | "type": "git", 20 | "url": "git+https://github.com/tpenaranda/vue-cryptojs.git" 21 | }, 22 | "author": "Tate Peñaranda", 23 | "license": "AFL-2.0", 24 | "peerDependencies": { 25 | "vue": ">= 2.0.0" 26 | }, 27 | "devDependencies": { 28 | "@babel/cli": "^7.17.10", 29 | "@babel/core": "^7.18.2", 30 | "@babel/preset-env": "^7.10.4", 31 | "babel-preset-minify": "^0.5.2", 32 | "vue": "2.6.11" 33 | }, 34 | "dependencies": { 35 | "crypto-js": "^4.0.0" 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /dist/vue-cryptojs.es5.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | 3 | Object.defineProperty(exports, "__esModule", { 4 | value: true 5 | }); 6 | exports["default"] = void 0; 7 | var _cryptoJs = _interopRequireDefault(require("crypto-js")); 8 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } 9 | /* eslint-disable */ 10 | 11 | var VueCryptojs = { 12 | install: function install(Vue, options) { 13 | Vue.CryptoJS = _cryptoJs["default"]; 14 | 15 | // VueJS 2 16 | 17 | if (Vue.prototype) { 18 | Object.defineProperties(Vue.prototype, { 19 | $CryptoJS: { 20 | get: function get() { 21 | return _cryptoJs["default"]; 22 | } 23 | }, 24 | CryptoJS: { 25 | get: function get() { 26 | return _cryptoJs["default"]; 27 | } 28 | } 29 | }); 30 | } 31 | 32 | // VueJS 3 33 | 34 | if (Vue.config && Vue.config.globalProperties) { 35 | Vue.config.globalProperties.$CryptoJS = _cryptoJs["default"]; 36 | } 37 | if (Vue.provide && typeof Vue.provide === 'function') { 38 | Vue.provide('cryptojs', _cryptoJs["default"]); 39 | } 40 | if (typeof window !== 'undefined' && window.Vue) { 41 | window.Vue.use(VueCryptojs); 42 | } 43 | } 44 | }; 45 | var _default = exports["default"] = VueCryptojs; 46 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # vue-cryptojs 2 | A small wrapper for integrating crypto-js into Vue3 and Vue2 3 | 4 | ## Discontinued 5 | 6 | Active development of Vue-CryptoJS has been discontinued. This library is no longer maintained. 7 | 8 | Nowadays, NodeJS and modern browsers have a native `Crypto` module. The latest version of CryptoJS already uses the native Crypto module for random number generation, since `Math.random()` is not crypto-safe. Further development of CryptoJS would result in it only being a wrapper of native Crypto. Therefore, development and maintenance has been discontinued, it is time to go for the native `crypto` module. 9 | 10 | ## How to install: 11 | ```bash 12 | npm install vue-cryptojs 13 | ``` 14 | 15 | ### Vue3 16 | Entry file: 17 | ```js 18 | 19 | import { createApp } from 'vue' 20 | import VueCryptojs from 'vue-cryptojs' 21 | 22 | createApp(...).use(VueCryptojs).mount(...) 23 | ``` 24 | 25 | TS Component: 26 | ```js 27 | 33 | 34 | 38 | ``` 39 | 40 | `inject` on Composition API without TS: 41 | ```js 42 | 55 | ``` 56 | 57 | ### Vue2 58 | ```js 59 | import Vue from 'vue' 60 | import VueCryptojs from 'vue-cryptojs' 61 | 62 | Vue.use(VueCryptojs) 63 | ``` 64 | 65 | This binds `CryptoJS` to `Vue` or `this` if you're using single file component. 66 | 67 | Simple AES text encrypt/decrypt example: 68 | ```js 69 | const encryptedText = this.$CryptoJS.AES.encrypt("Hi There!", "Secret Passphrase").toString() 70 | const decryptedText = this.$CryptoJS.AES.decrypt(encryptedText, "Secret Passphrase").toString(this.$CryptoJS.enc.Utf8) 71 | ``` 72 | 73 | Directly on a template: 74 | ```js 75 | 80 | ``` 81 | 82 | Please kindly check full documention of [crypto-js](https://github.com/brix/crypto-js) 83 | --------------------------------------------------------------------------------