{"id":28756857,"url":"https://github.com/wx-chevalier/vscode-snippets","last_synced_at":"2026-03-04T02:02:45.612Z","repository":{"id":42982645,"uuid":"214416550","full_name":"wx-chevalier/vscode-snippets","owner":"wx-chevalier","description":"[Docs \u0026 Development] A collection of daily snippets for Visual Studio Code, for happy coding. ","archived":false,"fork":false,"pushed_at":"2022-03-24T20:41:45.000Z","size":285,"stargazers_count":7,"open_issues_count":3,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-06-17T03:08:58.817Z","etag":null,"topics":["wx-code","wx-snippets"],"latest_commit_sha":null,"homepage":"https://github.com/wx-chevalier/vscode-snippets","language":null,"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/wx-chevalier.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":"2019-10-11T11:15:44.000Z","updated_at":"2024-10-08T08:06:10.000Z","dependencies_parsed_at":"2022-09-19T18:50:26.999Z","dependency_job_id":null,"html_url":"https://github.com/wx-chevalier/vscode-snippets","commit_stats":null,"previous_names":["wx-chevalier/ngte-vscode-snippets","wx-chevalier/vscode-snippets"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/wx-chevalier/vscode-snippets","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wx-chevalier%2Fvscode-snippets","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wx-chevalier%2Fvscode-snippets/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wx-chevalier%2Fvscode-snippets/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wx-chevalier%2Fvscode-snippets/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/wx-chevalier","download_url":"https://codeload.github.com/wx-chevalier/vscode-snippets/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wx-chevalier%2Fvscode-snippets/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30069236,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-04T01:03:42.280Z","status":"online","status_checked_at":"2026-03-04T02:00:07.464Z","response_time":59,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["wx-code","wx-snippets"],"created_at":"2025-06-17T03:08:58.172Z","updated_at":"2026-03-04T02:02:45.598Z","avatar_url":"https://github.com/wx-chevalier.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"# VSCode Essentials Snippets\n\n\u003e A collection of essentials snippets for Visual Studio Code.\n\n![Preview](images/preview.gif)\n\nSnippets are generated with [snippet-generator](https://snippet-generator.app/).\n\n![snippet-generator](https://s2.ax1x.com/2019/10/11/uqUDJA.png)\n\n# Installation\n\n1. Install [Visual Studio Code](https://code.visualstudio.com/)\n2. Launch Visual Studio Code\n3. Choose **Extensions** from menu\n4. Search for `@m-fe/vscode-snippets`\n5. Click **Install** to install it\n6. Click **Reload** to reload the Code\n\n# Usage\n\nType part of a snippet, press `enter` and the snippet unfolnds. For snippets in markdown format you need to press `ctrl+space` (Windows / Linux) or `cmd+space` (OSX).\n\n## Angular snippets\n\n### TypeScript snippets\n\n| Snippet              | Content                      |\n| -------------------- | ---------------------------- |\n| `ng-class`           | Angular Class                |\n| `ng-component`       | Angular Component            |\n| `ng-component-input` | Angular Component with Input |\n| `ng-directive`       | Angular Directive            |\n| `ng-enum`            | Angular Enum                 |\n| `ng-guard`           | Angular Guard                |\n| `ng-interface`       | Angular Interface            |\n| `ng-module`          | Angular Module               |\n| `ng-pipe`            | Angular Pipe                 |\n| `ng-service`         | Angular Service              |\n\n### RxJS Snippets\n\n| Snippet               | Content                     |\n| --------------------- | --------------------------- |\n| `rx-extensions`       | RxJS Extensions import      |\n| `rx-observable`       | RxJS Observable import      |\n| `rx-subject`          | RxJS Subject import         |\n| `rx-subject-behavior` | RxJS BehaviorSubject import |\n| `rx-subject-replay`   | RxJS ReplaySubject import   |\n| `rx-add-observable`   | RxJS add observable import  |\n| `rx-add-operator`     | RxJS add operator import    |\n\n### HTML snipppets\n\n| Snippet               | Content                                   |\n| --------------------- | ----------------------------------------- |\n| `ng-ngFor`            | Angular \\*ngFor                           |\n| `ng-ngIf`             | Angular \\*ngIf                            |\n| `ng-ngModel`          | Angular ngModel                           |\n| `ng-routerLink`       | Angular routerLink                        |\n| `ng-routerLink-param` | Angular routerLink with a route parameter |\n| `ng-select`           | select control with ngModel               |\n| `ng-pre`              | Angular pre with json                     |\n\n## Continuous Integration snippets\n\n| Snippet       | Content                     |\n| ------------- | --------------------------- |\n| `ci-appveyor` | AppVeyor configuration file |\n| `ci-circle`   | Circle configuration file   |\n| `ci-travis`   | Travis configuration file   |\n\n## Git snippets\n\n| Snippet                     | Content                         |\n| --------------------------- | ------------------------------- |\n| `gitattributes`             | .gitattributes file with eol=lf |\n| `gitattributes-archives`    | Set archives as binary          |\n| `gitattributes-documents`   | Set documents as binary         |\n| `gitattributes-executables` | Set executables as binary       |\n| `gitattributes-fonts`       | Set fonts as binary             |\n| `gitattributes-graphics`    | Set graphics as binary          |\n| `CHANGELOG`                 | A CHANGELOG.md template         |\n| `README`                    | A README.md template            |\n\n## Lint snippets\n\n| Snippet        | Content                   |\n| -------------- | ------------------------- |\n| `eslint`       | ESLint configuration file |\n| `eslintignore` | ESLint ignore file        |\n\n## Project snippets\n\n| Snippet        | Content                |\n| -------------- | ---------------------- |\n| `editorconfig` | EditorConfig file      |\n| `npmrc`        | npm configuration file |\n| `package`      | package.json file      |\n\n# Development\n\n## Install dependencies\n\n1. Install [Node.js](https://nodejs.org/) and [npm](https://www.npmjs.com/)\n2. Install [Visual Studio Code](https://code.visualstudio.com/)\n\n## Run\n\nClone the repo\n\n```bash\n$ git clone https://github.com/wx-chevalier/dd-vscode-snippets.git\n```\n\nInstall vsce\n\n```bash\n$ npm install -g vsce\n```\n\nBuild the extension file\n\n```bash\n$ vsce package\n\n# or\n\n$ npm run build\n```\n\nInstall the extension from a package file (.vsix)\n\n1. Launch Visual Studio Code\n2. Choose **Extensions** from menu\n3. Click **More** \u003e **Install from VSIX...**\n4. Select the file `@m-fe/vscode-snippets-x.x.x.vsix`\n5. Click **Reload Now** to reload the Code\n\n## Publish\n\nInstall vsce\n\n```bash\n$ npm install -g vsce\n```\n\nCreate a publisher\n\n```bash\n$ vsce create-publisher \u003cpublisher-name\u003e\n```\n\nLogin\n\n```bash\n$ vsce login \u003cpublisher-name\u003e\n```\n\nPublish\n\n```bash\n$ vsce publish\n```\n\nFor more detailed information about publish: [Publishing Extensions](https://code.visualstudio.com/docs/extensions/publish-extension).\n\n# About\n\n## License\n\n[MIT](https://github.com/wx-chevalier/@m-fe/vscode-snippets/blob/master/LICENSE)\n\n## Home \u0026 More | 延伸阅读\n\n![技术视野](https://s2.ax1x.com/2019/09/30/uJWQTx.jpg)\n\n您可以通过以下导航来在 Gitbook 中阅读笔者的系列文章，涵盖了技术资料归纳、编程语言与理论、Web 与大前端、服务端开发与基础架构、云计算与大数据、数据科学与人工智能、产品设计等多个领域：\n\n- 知识体系：《[Awesome Lists | CS 资料集锦](https://ngte-al.gitbook.io/i/)》、《[Awesome CheatSheets | 速学速查手册](https://ngte-ac.gitbook.io/i/)》、《[Awesome Interviews | 求职面试必备](https://github.com/wx-chevalier/Awesome-Interviews)》、《[Awesome RoadMaps | 程序员进阶指南](https://github.com/wx-chevalier/Awesome-RoadMaps)》、《[Awesome MindMaps | 知识脉络思维脑图](https://github.com/wx-chevalier/Awesome-MindMaps)》、《[Awesome-CS-Books | 开源书籍（.pdf）汇总](https://github.com/wx-chevalier/Awesome-CS-Books)》\n\n- 编程语言：《[编程语言理论](https://ngte-pl.gitbook.io/i/)》、《[Java 实战](https://github.com/wx-chevalier/Java-Series)》、《[JavaScript 实战](https://github.com/wx-chevalier/JavaScript-Series)》、《[Go 实战](https://ngte-pl.gitbook.io/i/go/go)》、《[Python 实战](https://ngte-pl.gitbook.io/i/python/python)》、《[Rust 实战](https://ngte-pl.gitbook.io/i/rust/rust)》\n\n- 软件工程、模式与架构：《[编程范式与设计模式](https://ngte-se.gitbook.io/i/)》、《[数据结构与算法](https://ngte-se.gitbook.io/i/)》、《[软件架构设计](https://ngte-se.gitbook.io/i/)》、《[整洁与重构](https://ngte-se.gitbook.io/i/)》、《[研发方式与工具](https://ngte-se.gitbook.io/i/)》\n\n* Web 与大前端：《[现代 Web 全栈开发与工程架构](https://ngte-web.gitbook.io/i/)》、《[数据可视化](https://ngte-fe.gitbook.io/i/)》、《[iOS](https://ngte-fe.gitbook.io/i/)》、《[Android](https://ngte-fe.gitbook.io/i/)》、《[混合开发与跨端应用](https://ngte-fe.gitbook.io/i/)》\n\n* 服务端开发实践与工程架构：《[服务端基础](https://ngte-be.gitbook.io/i/)》、《[微服务与云原生](https://ngte-be.gitbook.io/i/)》、《[测试与高可用保障](https://ngte-be.gitbook.io/i/)》、《[DevOps](https://ngte-be.gitbook.io/i/)》、《[Spring](https://github.com/wx-chevalier/Spring-Series)》、《[信息安全与渗透测试](https://ngte-be.gitbook.io/i/)》\n\n* 分布式基础架构：《[分布式系统](https://ngte-infras.gitbook.io/i/)》、《[分布式计算](https://ngte-infras.gitbook.io/i/)》、《[数据库](https://github.com/wx-chevalier/Database-Series)》、《[网络](https://ngte-infras.gitbook.io/i/)》、《[虚拟化与云计算](https://github.com/wx-chevalier/Cloud-Series)》、《[Linux 与操作系统](https://github.com/wx-chevalier/Linux-Series)》\n\n* 数据科学，人工智能与深度学习：《[数理统计](https://ngte-aidl.gitbook.io/i/)》、《[数据分析](https://ngte-aidl.gitbook.io/i/)》、《[机器学习](https://ngte-aidl.gitbook.io/i/)》、《[深度学习](https://ngte-aidl.gitbook.io/i/)》、《[自然语言处理](https://ngte-aidl.gitbook.io/i/)》、《[工具与工程化](https://ngte-aidl.gitbook.io/i/)》、《[行业应用](https://ngte-aidl.gitbook.io/i/)》\n\n* 产品设计与用户体验：《[产品设计](https://ngte-pd.gitbook.io/i/)》、《[交互体验](https://ngte-pd.gitbook.io/i/)》、《[项目管理](https://ngte-pd.gitbook.io/i/)》\n\n* 行业应用：《[行业迷思](https://github.com/wx-chevalier/Business-Series)》、《[功能域](https://github.com/wx-chevalier/Business-Series)》、《[电子商务](https://github.com/wx-chevalier/Business-Series)》、《[智能制造](https://github.com/wx-chevalier/Business-Series)》\n\n此外，你还可前往 [xCompass](https://wx-chevalier.github.io/home/#/search) 交互式地检索、查找需要的文章/链接/书籍/课程；或者在 [MATRIX 文章与代码索引矩阵](https://github.com/wx-chevalier/Developer-Zero-To-Mastery)中查看文章与项目源代码等更详细的目录导航信息。最后，你也可以关注微信公众号：『**某熊的技术之路**』以获取最新资讯。\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwx-chevalier%2Fvscode-snippets","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwx-chevalier%2Fvscode-snippets","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwx-chevalier%2Fvscode-snippets/lists"}