hvordan man aktiverer atom live server


Svar 1:

Pakker til almindeligt formål til Atom:

  • atom-lignende-parentes-editor - se, hvor dine krøllede seler “{}”, parens “()” starter og slutter ved at lade din markør blot røre ved dem.
  • atom-beautify - forskøn HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C ++, C #, Objective-C, CoffeeScript, TypeScript og SQL i Atom
  • atom-live-server - start en http-server med livereload-kapacitet.
  • browser-plus - giver dig mulighed for at starte en webbrowser i Atom i en ny fane
  • udklipsholder-autofuldførelse - Få let teksten fra dit udklipsholder ved hjælp af 'cp' i din edito!
  • fil-ikoner - tildeler filudvidelsesikoner og farver til filer for forbedret visuel grepping
  • filstørrelse - viser den aktuelle filstørrelse på statuslinjen
  • file-watcher - En åben filovervågning for Atom, der beder, når filen på disken er ændret.
  • git-klon - hurtigt git klon en repo og åbn i et nyt atomvindue
  • git-plus - giver dig mulighed for at foretage git-handlinger uden at gå til terminalen
  • git-time-machine - interagere visuelt med git commit-historik for en fil
  • highlight-line - fremhæver den aktuelle linje i editoren
  • markeret - når du dobbeltklikker på et ord, fremhæver det andre forekomster af ordet i en fil. (denne pakke med minimap-highlight-valgt er fantastisk)
  • jumpy - opretter dynamiske genvejstaster til at hoppe rundt om filer på tværs af synlige ruder.
  • linter - en basislinter til Atom. Du installerer andre linterpakker oven på dette. Søg efter andre linterpakker med ordet "linter" foran. Eks: linter-jshint, linter-csslint, linter-jsonlint, linter-ruby, linter-pylint
  • lokalhistorie - GJEDTE MIG SÅ MANGE GANGER, NÅR GIT DIDNT! opretholder historik over dine ændringer i kodefilerne. Tænk på Google Docs revisionshistorik. Virkelig stærk, når du glemte at begå noget eller bruge Git.
  • maybs-quit - modal bekræftelse før afslutning for at forhindre utilsigtet lukning af editoren med tasterne [CMD-Q].
  • flette-konflikter - giver dig mulighed for at løse git-konflikter inden for Atom
  • minimap - En forhåndsvisning af den fulde kildekode (som Sublime Text). BEMÆRK: De andre mini-kortpakker nedenfor er afhængige af at have minimap installeret. Disse pakker, der bruges sammen, giver efter min mening en stærk redigeringsoplevelse.
  • minimap-cursorline - Viser Atom-cursorline i minimaportet
  • minimap-find-and-replace - vis find & erstat pakkeresultater i minimap
  • minimap-fremhæv-valgt - viser dit valg i minimap. ⚠ fremhævet valgt pakke er påkrævet.
  • minimap-markering - fremhæver forekomster af aktuelt valgte ord i minimap. Dette er en fantastisk måde at se på, hvor mange forekomster der er, og hvor de findes i filen!
  • minimap-git-diff - vis gitændringer på minikortet (grøn = tilføjelse, gul = ændring, rød = sletning). Fantastisk til hurtigt at kigge på sektioner, du har ændret i store filer!
  • open-in-browser - tilføjer "Åbn i browser" til kommandopaletten og klik på menuen
  • open-terminal-here - tilføjer "Open Terminal Here" til kommandopaletten og klik på menuen option
  • pakke-manager-kommandoer - deaktiver / aktiver pakker fra kommandopaletten (som Sublime Text).
  • pakkeindstillinger - åbn hurtigt indstillingsruden for en bestemt pakke (som Sublime Text)
  • rude-layout-plus - gør det muligt at oprette flere ruder i editoren (som sublim tekst)
  • script - giver dig mulighed for at køre forskellige scriptfiler inde i Atom. Understøtter JavaScript, CoffeeScript, Ruby, Python, Go, Bash og PowerShell-scripts. Du kan tilføje mere!
  • sæt-syntaks - opretter nemme kommandopalettekommandoer til indstilling af syntaksen for den aktuelle fil (identisk sæt syntaks-kommando fra sublim)
  • swackets - gør det lettere at vide, hvor indlejret du er inde i funktioner, betingede udsagn
  • synkroniseringsindstillinger - synkroniser pakkeindstillinger, nøglekort og installerede pakker
  • tree-view-autoresize - Autoresize trævisningen, når mapper åbnes / lukkes
  • tree-view-git-status - se hurtigt din Git-lagerstatus i Atom-trævisningen.
  • platformio-ide-terminal- giver dig mulighed for at starte flere terminalsessioner inde fra Atom-editoren (understøtter andre skaller såsom zsh osv ..)
  • rest-client - en simpel REST-klient til din foretrukne editor (tænk på Postman, men inden i din editor)
  • wakatime - Fitbit til programmører. Få automatiserede metrics og indsigt i din programmering.

Frontend / Web-relaterede pakker til Atom:

  • atom-json-farve - farve JSON med en farve pr. niveau
  • auto-id-klasse
  • autoclose-html - automatiserer lukning af HTML-tags
  • autoprefixer - autoprefixer dine CSS- og SCSS-filer
  • farvevælger - bringer en interaktiv farvevælger op fra Atom
  • css-clean - smukt sorterer og justerer CSS og SASS
  • css-specificitet - viser specificiteten af ​​vælgerne i en CSS-fil i Atom
  • docblockr - gør skrivning af javascript-kodekommentarer til en leg!
  • emmet - giver genveje til oprettelse af elementer, tilføjelse af attributter og værdier og mere, når du arbejder med HTML & CSS-filer
  • livestyle-atom - realtids tovejs redigeringsværktøj til CSS, LESS og SCSS
  • pigmenter - viser farver i projekt og filer.
  • es6-javascript - javascript-uddrag til udviklingsproduktivitet

Sænker din editor din redaktion, hvis du har alle disse pakker?

  • Nej, jeg har ikke mærket nogen afmatning. Folk med spindende harddiske (HDD) og mindre RAM kan, men hvis du har over 4 GB RAM og en solid-state harddisk (SSD), skal dine hastigheder være hurtige.
  • Hvorfor bruger du så mange pakker?

    • Atom er en barebones editor, det er op til brugeren at tilføje yderligere funktionalitet ved at installere pakker
    • Jeg bruger faktisk alle disse pakker. Mange af disse pakker bringer funktionalitet fra andre redaktører til Atom som Sublime, VScode osv.
    • Min teksteditor er som min bil, jeg kan godt lide den fuldt udstyret og klar til at rulle.

    Demo:

    • Du kan se de fleste af Atom-editorpakkerne, jeg nævnte ovenfor i den YouTube-video, jeg lavede: Atom Editor - Oversigt og Top Packages Roundup
    • Blogindlæg, der viser de anvendte pakker:

      Atom Editor: Oversigt & Package Roundup

Svar 2:

atom-minimap:

markeret-valgt:

minimap-fremhæv-valgt:

fremhæv-kolonne:

projektleder:

atom-forskønne:

fil-ikoner:

farvevælger:

Tip: Nogle plugins kan virkelig bremse atom. Hvis du føler at atom er langsomt, skal du kigge på Packages-> Timecop for at se, om pluginet bremser atom.