Webpack-dev-szerver - szerelése, beállítása és kezelése

  • minden
  • háttér
  • frontend
  • munkafolyamat
  • tervezés
  • vegyes cikkek
  • programozási nyelvek
    • # 3 - Hogyan kezdjük el (System.js)

    • # 4 - Hogyan kezdjük el (Szög CLI)

    • # 2 - Hogyan kezdjük el (plnkr.co)

    • # 5 - Egyesület. Sok-sok

    • Mi újság a fogadási pay-per-erőforrás «Elasticweb»?

    • # 7 - Project szinkronizálás egy távoli szerver PHPStorm. Telepítését.

    • # 3 - Hogyan kezdjük el (System.js)

    • # 4 - Hogyan kezdjük el (Szög CLI)

    • # 2 - Hogyan kezdjük el (plnkr.co)

    • # 1 - Hogyan lehet elkezdeni (script tag)

    • # 14 - Fájl-rakodó, ha dolgozik, képek

    • # 13 - UglifyJsPlugin - plugin minifitsirovaniya js-kód

    • # 12 - ProvidePlugin - dugó, a plug-in magad

    • # 11 - CommonsChunkPlugin - plug-in, ami a közös kódex css- és js-fájlok

    • # 1 - Bevezető lecke

    • # 4 - Moduláris rács Photoshop

    • # 5 - 5 zseton Photoshop web design.

    • # 5 - Egy hatékony vezető IT-projektek

    • # 4 - Scrum - részletes vizsgálata a módszertan

    • # 4 - Hozzon létre egy műszaki specifikáció a mobil alkalmazások

    • # 3 - Menetes vagy klasszikus projektmenedzsment módszer

    • # 3 - Hogyan kezdjük el (System.js)

    • # 4 - Hogyan kezdjük el (Szög CLI)

    • # 2 - Hogyan kezdjük el (plnkr.co)

    • # 1 - Hogyan lehet elkezdeni (script tag)

      • minden
      • DevShow
      • Loftcast
      • Loftnews
      • LoftSchool
      • LoftVlog
      • interjú
        • # 23: Programozási játék!

        • NIMAX. Kirándulás a digitális világ. Interjú Nikita Miheenkovym

        • # 23: Programozási játék!

        • # 23: Hogyan kell munkát keresni, mint egy webfejlesztő?

        • # 22: Top lakosság, tooltips és a modális ablakok

        • # 21: Zene programozók - mit hallgatni, amikor írsz kódot?

        • Loftcast # 3 - browsersync, Marksheet, magasztos szöveg vs atom vs konzolok

        • Loftcast # 2 - Érzékeny Patterns, Atom, PostCsskov

        • Loftcast # 1 - dotdotdot.js. webpack, plainjs.com

        • Samsung S8, az Apple fizetős, Made by Google, a Samsung fizetős, PPAP

        • 8 iPhone, YouTube Go Android plusz Chrome OS reagálnak

        • Samsung felrobban, Bootstrap Elavult, iPhone 7, az Apple Watch, iOS 10

        • LoftNews # 30 - Fiat 124 Spider Sport, auto.ru, Google Maps

        • Mint programozó töltik a telet Tae?

        • Mivel az IT-szakemberek, hogy a távoli és élni bárhol a világon?

        • Odesk - belépési stratégiák, a nyelv, a profilt, és bejelentés

        • Hogyan át a próbaidő? Top tippek LoftSchool alapítók

        • Budapest City, LoftSchool egy fotózásra, felkészülés LBMM

        • Szentpétervárról Moszkvába. Látogatás Avito. Főzés MeetUp!

        • Hol Loft csapat

        • NIMAX. Kirándulás a digitális világ. Interjú Nikita Miheenkovym

        • Gleb Kushedov, alapítója Epic készségek: Oktatás az Informatikai

          Hello mindenkinek! A nevem Kovalcsuk Dmitry. Akkor nézd Loftskul. Mi továbbra is tanulni Webpack.

          A még nagyobb kényelem a fejlesztők a hivatalos dokumentumok Webpack javasoltuk, hogy az „webpack-dev-szerver”. Ahogy épül, és a helyi szerver livereload ( „Élő indítsa újra a böngészőt”). WDS is tetszik rugalmas konfigurációs lehetőségeket. Külön szeretnénk kiemelni két pontot:

          1. Webpack-dev-szerver működik „a memóriában” ( „kiszolgáló fut-memory”) - nem hoz létre a projektben könyvtárban összeállított fájlokat.

          2. „Hot modul csere (HMR)” - lehetővé teszi, hogy frissítse az egyes oldalak nélküli modulok teljes reboot. Teljes teljesítmény is éreztem, amikor használni reagálni.

          1. Telepítse és futtassa webpack-dev-szerver

          Mi létre webpack-dev-szerver, és mentse el package.json.

          fonal add webpack - dev - szerver - D

          Hogy integrálja webpack-dev-szerver a projekt, meg kell adnunk az új NPM-script (a package.json fájl).
          Ezt hívjuk «indul». A szkript fut Webpack térfigyelő helyébe egy egyszerű kezdő Webpack felügyelet nélkül. Feladata -, hogy egyszerűen építeni a projekt, és a nevét is megadja a megfelelő - «építeni».

          Mi fog eljárni. A böngészőben látjuk honlapunkon, ahogy volt a statikus szerver.
          Azonban most a mi arzenál megjelent livereload. Próbáljuk, hogy módosítsa a sablonok, vagy js-fájlokat.

          Törölni a mappát, és újra építeni, győződjön meg róla - nincs összeállított fájlokat a projekt könyvtárban, azaz A WDS „gyűjti” a projekt közvetlenül a memóriába.

          WDS nem ajánlott Productions, így ellenőrizni segítségével összegyűjtött Webpack szerelvény tudjuk, mint korábban, a segítségével «node-statikus».

          2. Az alapvető beállítások webpack-dev-szerver

          A WDS, mint korábban említettük, van egy hatalmas számú beállításokat. Ezeket a beállításokat kell helyezni a „devServer” objektum, amely az ingatlan a modul, akkor az exportált config Webpack. A példánkban lesz elég ahhoz, hogy egy másik tulajdon „statisztika”. Rendeljen meg egy értéket a „hibák csak”. Most, amikor elkezdi webpack-dev-szerver, a konzol látni fogjuk sokkal kevesebb információ (nevezetesen: „Csak a hibák”).

          Kapcsolódó cikkek