json Conf VSCode片段
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了json Conf VSCode片段相关的知识，希望对你有一定的参考价值。
{
"aa-material-module": {
"prefix": "aa-material-module",
"body": [
"import { NgModule } from '@angular/core';",
"import {",
" MatAutocompleteModule,",
" MatBadgeModule,",
" MatBottomSheetModule,",
" MatButtonModule,",
" MatButtonToggleModule,",
" MatCardModule,",
" MatCheckboxModule,",
" MatChipsModule,",
" MatDatepickerModule,",
" MatDialogModule,",
" MatDividerModule,",
" MatExpansionModule,",
" MatFormFieldModule,",
" MatGridListModule,",
" MatIconModule,",
" MatInputModule,",
" MatListModule,",
" MatMenuModule,",
" MatNativeDateModule,",
" MatPaginatorModule,",
" MatProgressBarModule,",
" MatProgressSpinnerModule,",
" MatRadioModule,",
" MatRippleModule,",
" MatSelectModule,",
" MatSidenavModule,",
" MatSliderModule,",
" MatSlideToggleModule,",
" MatSnackBarModule,",
" MatSortModule,",
" MatStepperModule,",
" MatTableModule,",
" MatTabsModule,",
" MatToolbarModule,",
" MatTooltipModule,",
" MatTreeModule,",
"} from '@angular/material';",
"",
"@NgModule({",
"exports: [",
" MatAutocompleteModule,",
" MatBadgeModule,",
" MatBottomSheetModule,",
" MatButtonModule,",
" MatButtonToggleModule,",
" MatCardModule,",
" MatCheckboxModule,",
" MatChipsModule,",
" MatDatepickerModule,",
" MatDialogModule,",
" MatDividerModule,",
" MatExpansionModule,",
" MatFormFieldModule,",
" MatGridListModule,",
" MatIconModule,",
" MatInputModule,",
" MatListModule,",
" MatMenuModule,",
" MatNativeDateModule,",
" MatPaginatorModule,",
" MatProgressBarModule,",
" MatProgressSpinnerModule,",
" MatRadioModule,",
" MatRippleModule,",
" MatSelectModule,",
" MatSidenavModule,",
" MatSliderModule,",
" MatSlideToggleModule,",
" MatSnackBarModule,",
" MatSortModule,",
" MatStepperModule,",
" MatTableModule,",
" MatTabsModule,",
" MatToolbarModule,",
" MatTooltipModule,",
" MatTreeModule,",
"]",
"})",
"export class MaterialModule {}",
""
],
"description": "Imports all Angular Material modules"
},
"aa-route-paths": {
"prefix": "aa-route-paths",
"body": [
"{path: 'planets', component: PlanetListComponent},",
"{path: '', redirectTo: 'planets', pathMatch: 'full'},"
],
"description": "Routing paths"
},
"aa-planet-service": {
"prefix": "aa-planet-service",
"body": [
"baseUrl = 'https://my-json-server.typicode.com/arnaudleray/astro-api';",
"",
"constructor(",
" private httpClient: HttpClient,",
") { }",
"",
"getPlanets() {",
" return this.httpClient.get<any[]>(`\\${this.baseUrl}/planets`);",
"}",
"",
"getPlanet(id) {",
" return this.httpClient.get(`\\${this.baseUrl}/planets/\\${id}`);",
"}",
""
],
"description": "Planet service"
},
"aa-call-getplanets-async-await": {
"prefix": "aa-call-getplanets-async-await",
"body": [
"try {",
" this.planets = await this.planetService.getPlanets().toPromise();",
"} catch (error) {",
" alert(error.message);",
"}"
],
"description": "Call the getPlanets function with async/await"
},
"aa-call-getplanets-observer-subscribe": {
"prefix": "aa-call-getplanets-observer-subscribe",
"body": [
"this.planetService.getPlanets().subscribe(",
" planets => {",
" this.planets = planets;",
" },",
" error => {",
" alert(error.message);",
" }",
");"
],
"description": "Call the getPlanets function with subscribe"
},
"aa-get-url-param-1-statique": {
"prefix": "aa-get-url-param-1-statique",
"body": [
"const id = this.route.snapshot.paramMap.get('id');",
"",
"try {",
" this.planet = await this.planetService.getPlanet(id).toPromise();",
"} catch (error) {",
" alert(error.message);",
"}"
],
"description": "Récupération statique du paramètre d'URL"
},
"aa-get-url-param-2-dynamique": {
"prefix": "aa-get-url-param-2-dynamique",
"body": [
"this.route.paramMap.pipe(",
" switchMap(params => (params.get('id')))",
").subscribe(async id => {",
" this.planet = await this.planetService.getPlanet(id).toPromise();",
"});",
""
],
"description": "Récupération statique du paramètre d'URL"
},
"aa-detect-update": {
"prefix": "aa-detect-update",
"body": [
"if (this.swUpdate.isEnabled) {",
" this.swUpdate.available.subscribe(() => {",
" if (confirm('Une mise à jour est disponible. Souhaitez-vous relancer l\\'application ?')) {",
" window.location.reload();",
" }",
" });",
" }"
],
"description": "Détection des mises à jour de la PWA"
},
"aa-messaging-service": {
"prefix": "aa-messaging-service",
"body": [
"import { Injectable } from '@angular/core';",
"import { AngularFirestore } from 'angularfire2/firestore';",
"import { AngularFireAuth } from 'angularfire2/auth';",
"import * as firebase from 'firebase';",
"import { take } from 'rxjs/operators';",
"",
"@Injectable({",
" providedIn: 'root'",
"})",
"export class MessagingService {",
"",
" messaging = firebase.messaging();",
"",
" constructor(",
" private afs: AngularFirestore,",
" private afAuth: AngularFireAuth",
" ) { }",
"",
" updateToken(token) {",
" this.afAuth.authState.pipe(take(1)).subscribe(async user => {",
" if (!user) {",
" return;",
" }",
"",
" const userRef = this.afs.collection('users').doc(user.uid);",
" const userDoc = await userRef.ref.get();",
" const userData = userDoc.data();",
" if (!userData) {",
" userRef.set({fcmTokens: { [token]: true }});",
" } else {",
" const currentTokens = userData.fcmTokens || { };",
" // If the user does not already have the token, update the DB",
" if (!currentTokens[token]) {",
" // Add the token to the previous ones (case of a new device for a previous user).",
" const tokens = { ...currentTokens, [token]: true };",
" userRef.update({fcmTokens: tokens});",
" }",
" }",
" });",
" }",
"",
" getPermission() {",
" this.messaging.requestPermission()",
" .then(() => {",
" console.log('Notification permission granted.');",
" return this.messaging.getToken();",
" })",
" .then(token => {",
" console.log(token);",
" this.updateToken(token);",
" })",
" .catch((err) => {",
" console.log('Unable to get permission to notify.', err);",
" });",
" }",
"",
" receiveMessages() {",
" this.messaging.onMessage((payload) => {",
" console.log('Message received.', payload);",
" const data = (payload.data) ? payload.data : payload.notification;",
" alert(`Message reçu !\\n\\n${data.title}\\n${data.body}\\n${data.click_action}`);",
" });",
" }",
"",
"}",
""
],
"description": "MessagingService"
},
"aa-auth-service": {
"prefix": "aa-auth-service",
"body": [
"// http://javasampleapproach.com/frontend/angular/angular-4-firebase-auth-anonymous-authentication-with-angularfire2-auth-login",
"import { Injectable } from '@angular/core';",
"import { AngularFireAuth } from 'angularfire2/auth';",
"import { AngularFireDatabase } from 'angularfire2/database';",
"import { Router } from '@angular/router';",
"",
"@Injectable({",
" providedIn: 'root'",
"})",
"export class AuthService {",
"",
" authState: any = null;",
"",
" constructor(private afAuth: AngularFireAuth) {",
" this.afAuth.authState.subscribe((auth) => {",
" this.authState = auth;",
" });",
" }",
"",
" get isUserAnonymousLoggedIn(): boolean {",
" return (this.authState !== null) ? this.authState.isAnonymous : false;",
" }",
"",
" get currentUserId(): string {",
" return (this.authState !== null) ? this.authState.uid : '';",
" }",
"",
" anonymousLogin() {",
" return this.afAuth.auth.signInAnonymously()",
" .then((user) => {",
" this.authState = user;",
" console.log('Anonymous login', user);",
" })",
" .catch(error => console.error(error));",
" }",
"",
" signOut(): void {",
" this.afAuth.auth.signOut();",
" }",
"}",
""
],
"description": "AuthService"
},
"aa-init-push-app-component-ts": {
"prefix": "aa-init-auth-push-app-component-ts",
"body": [
"firebase.firestore.setLogLevel('debug');",
"",
"// Authentification anonyme",
"await this.authService.anonymousLogin();",
"// Demande de permission de push",
"this.msgService.getPermission();",
"// Gestion de la réception de push",
"this.msgService.receiveMessages();"
],
"description": "app.component.ts : initialisation du push"
}
}{
"aa-styles": {
"prefix": "aa-styles",
"body": [
"// Global",
"body {",
" margin: 0;",
" background-color: #000;",
"}",
"// Menu latéral",
".mat-drawer {",
" background-color: #333;",
" color: white;",
"}",
"// Toolbar",
".mat-sidenav-content {",
" padding-top: 55px;",
"",
" .mat-toolbar {",
" position: fixed;",
" z-index: 999;",
" top: 0;",
" } ",
"}",
"// Pages",
".mat-sidenav-container {",
" background-color: transparent;",
" color: white;",
" .mat-nav-list .mat-list-item {",
" color: white;",
" .mat-list-avatar {",
" width: 70px;",
" height: 70px;",
" border-radius: 0;",
" }",
" .mat-line:first-child {",
" font-size: 18px;",
" font-weight: bold;",
" }",
" .mat-line:nth-child(2) {",
" font-size: 16px;",
" }",
" }",
"}",
"app-planet-detail {",
" text-align: center;",
" font-family: Arial, Helvetica, sans-serif;",
"",
" .planet-name {",
" font-size: 24px;",
" text-transform: uppercase;",
" }",
" .planet-overview {",
" font-size: 20px;",
" text-align: left;",
" margin: 20px;",
" }",
" .planet-description {",
" text-align: justify;",
" margin: 20px;",
" }",
"}",
""
],
"description": ""
}
}{
"aa-ngsw-strategie-cache": {
"prefix": "aa-ngsw-strategie-cache",
"body": [
"\"dataGroups\": [{",
" \"name\": \"api-freshness\",",
" \"urls\": [",
" \"https://my-json-server.typicode.com/arnaudleray/astro-api/planets/*\"",
" ],",
" \"cacheConfig\": {",
" \"maxSize\": 100,",
" \"maxAge\": \"1h\",",
" \"timeout\": \"10s\",",
" \"strategy\": \"freshness\",",
" \"version\": 1",
" }",
"},",
"{",
" \"name\": \"api-performance\",",
" \"urls\": [",
" \"/assets/images/*\",",
" \"https://my-json-server.typicode.com/arnaudleray/astro-api/planets\"",
" ],",
" \"cacheConfig\": {",
" \"maxSize\": 100,",
" \"maxAge\": \"7d\",",
" \"strategy\": \"performance\",",
" \"version\": 1",
" }",
"}]"
],
"description": "Service Worker : stratégie de cache des données dans ngsw-config.json"
},
"aa-firebase-json-headers-cache": {
"prefix": "aa-firebase-json-headers-cache",
"body": [
"\"headers\": [",
" { \"source\": \"/ngsw-worker.js\", \"headers\": [{\"key\": \"Cache-Control\", \"value\": \"no-cache\"}] },",
" { \"source\": \"/firebase-messaging-sw.js\", \"headers\": [{\"key\": \"Cache-Control\", \"value\": \"no-cache\"}] },",
" { \"source\": \"/*.js\", \"headers\": [{\"key\": \"Cache-Control\", \"value\": \"max-age=8640000\"}] },",
" { \"source\": \"/*.css\", \"headers\": [{\"key\": \"Cache-Control\", \"value\": \"max-age=8640000\"}] },",
" { \"source\": \"/assets/images/*\", \"headers\": [{\"key\": \"Cache-Control\", \"value\": \"max-age=8640000\"}] },",
" { \"source\": \"https://fonts.googleapis.com/css.?family=Roboto:300,400,500\", \"headers\": [{\"key\": \"Cache-Control\", \"value\": \"max-age=8640000\"}] },",
" { \"source\": \"https://fonts.googleapis.com/*\", \"headers\": [{\"key\": \"Cache-Control\", \"value\": \"max-age=8640000\"}] }",
" ],"
],
"description": "Headers to avoid Firebase default cache in firebase.json"
}
}{
"aa-firebase-messaging-sw": {
"prefix": "aa-firebase-messaging-sw",
"body": [
"importScripts('https://www.gstatic.com/firebasejs/5.0.4/firebase-app.js');",
"importScripts('https://www.gstatic.com/firebasejs/5.0.4/firebase-messaging.js');",
"",
"firebase.initializeApp({",
" 'messagingSenderId': '846936545930' // YOUR SENDER ID: https://console.firebase.google.com/project/solarsystem-niji/settings/cloudmessaging/",
"});",
"",
"const messaging = firebase.messaging();",
"",
"self.addEventListener('push', function(e) {",
" var jsondata = JSON.parse(e.data.json().data.jsondata);",
"",
" e.waitUntil(",
" self.registration.showNotification(jsondata.title, jsondata)",
" );",
"});",
"",
"self.addEventListener('notificationclick', function(event) {",
" console.log('notificationclick', event.action);",
" var messageId = event.notification.data;",
" ",
" event.notification.close();",
" ",
" var url = event.action;",
" if (!url || url.length == 0) {",
" // Par défaut, on prend la 1ère action.",
" if (event.notification.actions.length > 0) {",
" url = event.notification.actions[0].action;",
" }",
" }",
" if (url && url.length > 0) {",
" clients.openWindow(url);",
" }",
"}, false);",
""
],
"description": "firebase-messaging-sw.js"
}
}{
"aa-page-list-html": {
"prefix": "aa-page-list-html",
"body": [
"<mat-nav-list>",
" <a mat-list-item *ngFor=\"let p of planets\">",
" <img matListAvatar [src]=\"p.thumbUrl\" [alt]=\"p.name\">",
" <h3 matLine class=\"planet-title\">{{p.name}}</h3>",
" <div matLine class=\"planet-overview\">{{p.overview}}</div>",
" </a>",
"</mat-nav-list>",
""
],
"description": ""
},
"aa-page-detail-html": {
"prefix": "aa-page-detail-html",
"body": [
"<div *ngIf=\"planet\">",
" <img matListAvatar [src]=\"planet.imageUrl\" [alt]=\"planet.name\">",
" <h3 class=\"planet-name\">{{planet.name}}</h3>",
" <div class=\"planet-overview\">{{planet.overview}}</div>",
" <div class=\"planet-description\">{{planet.description}}</div>",
"</div>",
""
],
"description": "Page detail"
}
}以上是关于json Conf VSCode片段的主要内容，如果未能解决你的问题，请参考以下文章