Návod je psaný pro OS Ubuntu, ale většinu příkazů a nastavení lze odvodit pro jakýkoliv operační systém.
Prošel jsem si pouze zlehka instalováním balíčků a používání Composer, Grunt, Gulp a Bower, ale nějak mě přestalo bavit mít ke každému nástroji nebo aplikaci pro spouštění skriptů zvlášť soubory a nelíbilo se mi mít pro každý nástroj adresář, než jsem objevil, že je možné používat
npm, jak pro instalaci balíčků, tak pro spouštění skriptů. Konkrétně jsem potřeboval vyřešit základní problémy, které mám při tvorbě webů:- instalaci Bootstrap,
- kompilaci SASS na CSS,
- minifikaci a sjednocení CSS souborů do jednoho
- a minifikaci JS.
Příprava npm
Takže jsem začal jednoduchou instalací:
sudo apt install npm
Zda se instalace zdařila můžete zjistit zadáním příkazu pro zjištění verze.
npm -v
Inicializace projektu
Vytvořte si adresář npm_project1 a v něm inicializujeme npm
cd mkdir npm_project1 cd npm_project1 npm init
Informace o projektu nechám na vás. Pokud budete mačkat enter, použije se implicitní hodnota, tedy ta co je v kulatých závorkách. Následně se vytvoří soubor package.json, což je hlavní meta-soubor, v kterém jsou obsaženy:
- základní informace o vašem balíčku / aplikaci, které jste vyplnili při npm init;
- dependencies – balíčky, které jsou potřeba ke spuštění vaší aplikace;
- devDependencies – balíčky, které používají programátoři při vývoji této aplikace;
- scripts – skripty, které se mohou provádět pomocí npm nad aplikací (např. minifikace CSS, kombinace skriptů, …);
Instalace prvního balíčku
Jako první vám představím balíček uglify-js, který slouží k minifikaci / zmenšení JS souborů.
npm install uglify-js
Všimněte si, že se vám vytvořil adresář node_modules, kde se nachází víc podadresářů než jen uglify-js. Je to z toho důvodu, že uglify-js používá nějaké další balíčky, které pro své fungování potřebuje a proto se tyto balíčky nainstalovaly současně s ním.
To je sice fajn, ale je to jen jednorázová záležitost. Pokud chcete, aby aplikaci mohli používat i jiní a nemuseli jste posílat celý adresář node_modules, stačí přidat parametr.
Pokud se jedná o dependencies, použije se parametr -S jako save
npm install balicek -S
v případě, že jde o balíček určený pro vývojáře, tedy devDependencies, což např. uglify-js je, se použije parametr -D jako developer.
npm install uglify-js -D
Více o příkazu npm install.
Módy
Při používání npm se můžete setkat se dvěma módy balíčků a to lokálním a globálním.
Lokální balíčky jsou nainstalovány vždy v adresáři projektu (např. /home/uzivatel/npm_project1/node_modules/).
Globální balíčky jsou nainstalovány v globálním adresáři, který je však ve vlastnictví uživatele root. Tento adresář zjistíte zadáním
npm config get prefix
V mém případě /usr/local. My však chceme umožnit spouštění globálním skriptů z balíčků jako klasický uživatel a ne jen jako uživatel root.
Výhodou globálních balíčků je, že pokud balíček využíváte ve více projektech nemusíte mít fyzicky soubory v každém projektu, ale jen v globálním adresáři.
Globální adresář s balíčky v domovském adresáři
cd mkdir .node_modules npm config set prefix=$HOME/.node_modules
Nyní je nastavený nový globální adresář (prefix) pro balíčky. Je však potřeba nainstalovat znovu npm. Použije se parametr pro instalaci do globálního adresáře -g.
cd .node_modules npm install npm -g
Dalším cílem, kterého jsem chtěl dosáhnout bylo použití skriptů přímo v příkazové řádce – tedy pak i ve vývojovém prostředí.
Integrace skriptů do příkazové řádky
Pokud chcete používat skripty jako běžné příkazy (ls, dir, apod.), tak musíte doplnit cesty pro spuštění. Konkrétně se jedná o konec souboru .profile v domovském adresáři.
cd nano .profile
a přidat úplně na konec
export PATH="$HOME/.node_modules_global/bin:$PATH"
Proveďte odhlášení a přihlaste se, aby se nová cesta aktualizovala a mohli jste ji používat.
Nyní nainstalujte uglify-js globálně
npm install uglify-js -g
a v příkazové řádce nyní můžete používat příkaz uglify-js.
Závěr
Článek jsem vytvořil pro svou referenci, ale doufám, že pomohl i někomu dalšímu, kdo měl při začátcích problémy nebo nejasnosti.
V dalším článku připravím už konkrétní možnosti spouštění skriptů přes package.json, které využívám.
Jedna odpověď