{"id":13473294,"url":"https://github.com/chmln/vue-wysiwyg","last_synced_at":"2025-05-16T12:01:49.614Z","repository":{"id":17118213,"uuid":"81167543","full_name":"chmln/vue-wysiwyg","owner":"chmln","description":"A lightweight WYSIWYG HTML editor for Vue.js","archived":false,"fork":false,"pushed_at":"2022-12-07T17:27:21.000Z","size":826,"stargazers_count":565,"open_issues_count":92,"forks_count":137,"subscribers_count":10,"default_branch":"master","last_synced_at":"2025-04-12T08:38:12.248Z","etag":null,"topics":["vue","wysiwyg","wysiwyg-editor","wysiwyg-html-editor"],"latest_commit_sha":null,"homepage":"https://chmln.github.io/vue-wysiwyg/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chmln.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-02-07T04:48:40.000Z","updated_at":"2025-04-02T16:51:26.000Z","dependencies_parsed_at":"2023-01-11T20:25:56.001Z","dependency_job_id":null,"html_url":"https://github.com/chmln/vue-wysiwyg","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chmln%2Fvue-wysiwyg","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chmln%2Fvue-wysiwyg/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chmln%2Fvue-wysiwyg/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chmln%2Fvue-wysiwyg/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chmln","download_url":"https://codeload.github.com/chmln/vue-wysiwyg/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254527074,"owners_count":22085918,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["vue","wysiwyg","wysiwyg-editor","wysiwyg-html-editor"],"created_at":"2024-07-31T16:01:02.435Z","updated_at":"2025-05-16T12:01:49.553Z","avatar_url":"https://github.com/chmln.png","language":"JavaScript","funding_links":[],"categories":["基于 Vue","UI组件","Components \u0026 Libraries","UI Components","JavaScript","For Vue","UI Components [🔝](#readme)"],"sub_categories":["形成","UI Components","Form"],"readme":"[![](https://user-images.githubusercontent.com/11352152/30252159-1bbb9cfe-963b-11e7-966c-b44116c74a86.png)](https://chmln.github.io/vue-wysiwyg/)\n\n\n## Usage\n\n\n### Install vue-wysiwyg\n\n``` bash\nnpm install vue-wysiwyg --save\n```\nOR\n\n``` bash\nyarn add vue-wysiwyg\n```\n\nIn your `main.js`:\n\n```js\nimport wysiwyg from \"vue-wysiwyg\";\nVue.use(wysiwyg, {}); // config is optional. more below\n```\n\nAlso make sure to load the stylesheet.\nThe exact syntax will depend on what preprocessor you use.\n\n```css\n@import \"~vue-wysiwyg/dist/vueWysiwyg.css\";\n```\n\nIn your components:\n```html\n\u003cwysiwyg v-model=\"myHTML\" /\u003e\n```\n\n## Config options\n\nAll keys are optional.\n\n```js\n{\n  // { [module]: boolean (set true to hide) }\n  hideModules: { \"bold\": true },\n\n  // you can override icons too, if desired\n  // just keep in mind that you may need custom styles in your application to get everything to align\n  iconOverrides: { \"bold\": \"\u003ci class='your-custom-icon'\u003e\u003c/i\u003e\" },\n\n  // if the image option is not set, images are inserted as base64\n  image: {\n    uploadURL: \"/api/myEndpoint\",\n    dropzoneOptions: {}\n  },\n\n  // limit content height if you wish. If not set, editor size will grow with content.\n  maxHeight: \"500px\",\n\n  // set to 'true' this will insert plain text without styling when you paste something into the editor.\n  forcePlainTextOnPaste: true,\n\n  // specify editor locale, if you don't specify this, the editor will default to english.\n  locale: 'hu'\n}\n```\nAvailable Modules:\n - bold\n - italic\n - underline\n - justifyLeft\n - justifyCenter\n - justifyRight\n - headings\n - link\n - code\n - orderedList\n - unorderedList\n - image\n - table\n - removeFormat\n - separator\n\nAvailable Locales:\n - english (default)\n - hungarian\n - dutch\n - german\n\nNote on the image upload API endpoint:\n- Image is uploaded by `multipart/form-data`\n- Your endpoint must respond back with a string, the URL for the image - e.g. `http://myapp.com/images/12345.jpg`\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchmln%2Fvue-wysiwyg","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchmln%2Fvue-wysiwyg","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchmln%2Fvue-wysiwyg/lists"}