# 使用NPM第一步安裝Tailwind css
---

事前先安裝[node.js](https://nodejs.org/en/)


選擇左邊較穩定版本 14.17.6 LTS

打開終端機


先輸入指令

    cd desktop
    mkdir test
    cd test

先建立一個package.json

    npm init


使用code指令打開vscode

    code .


終端機輸入安裝taillwindcss及postcss-cli和autoprefixer

    npm install -D tailwindcss postcss-cli autoprefixer


終端機輸入npx tailwindcss init -p

    npx tailwindcss init -p 


vscode建立css檔案

    @tailwind base;
    @tailwind components;
    @tailwind utilities;


接下來打開package.json


    "watch": "postcss css/style.css -o     dist/style.css --watch"

終端機輸入npm run watch輸入完
vscode自動生成出dist資料夾


在dist建立index.html

終端機安裝輕量化live server

    npm install -g live-server


安裝成功

終端機打開live-server

    live-server dist    


回到vscode測試live-server功能及tailwind是否引入成功

如果沒問題就成功使用npm安裝tailwind