tailwindlabs / discuss

A place to ask questions, get help, or share what you've built with Tailwind CSS.
MIT License
171 stars 9 forks source link

Tailwind css does not work on Windows #182

Open Lory1990 opened 5 years ago

Lory1990 commented 5 years ago

Hi guys! I downloaded a theme and edited the file package.json to add some dependencies, then I removed all the node_modules folder and hit yarn. Installation concludes with success but when i hit yarn start I get the following error:

".\node_modules\.bin\tailwind" is not recognized as internal or external command

so i run yarn add tailwindcss --dev and yarn getting the following error

"postcss" is not recognized as internal or external command

so i run yarn add postcss --dev and yarn getting the first error

Configuration file is

{
    "name": "AAA",
    "version": "1.0.0",
    "description": "AAA",
    "author": "AAA",
    "license": "UNLICENSED",
    "homepage": ".",
    "private": true,
    "scripts": {
        "start-webpack": "cross-env webpack-dev-server --config=webpack.dev.js --open --progress --colors --display-error-details",
        "build-webpack": "cross-env webpack --config=webpack.prod.js --progress --colors --display-error-details",
        "start": "yarn run build-css-helpers && cross-env NODE_PATH=src react-scripts start",
        "build": "yarn run build-css-helpers && cross-env NODE_PATH=src CI=false react-scripts build",
        "start-no-css": "cross-env NODE_PATH=src react-scripts start",
        "build-no-css": "cross-env NODE_PATH=src react-scripts build",
        "build-css-helpers": "./node_modules/.bin/tailwind build ./src/styles/fuse-helpers.tailwind.css -c ./tailwind.js -o ./src/styles/fuse-helpers.css && postcss --use autoprefixer -o ./src/styles/fuse-helpers.css ./src/styles/fuse-helpers.css",
        "test": "cross-env NODE_PATH=src react-scripts test --env=jsdom",
        "eject": "cross-env NODE_PATH=src react-scripts eject",
        "build-docs": "babel-node src/main/content/components/material-ui/build.js"
    },
    "dependencies": {
        "@material-ui/core": "1.4.3",
        "@material-ui/icons": "2.0.1",
        "autosuggest-highlight": "3.1.1",
        "axios": "0.18.0",
        "axios-mock-adapter": "1.15.0",
        "babel-plugin-import": "^1.9.1",
        "chart.js": "2.7.2",
        "downshift": "2.0.20",
        "formsy-react": "1.1.4",
        "input-moment": "^0.4.0",
        "jquery": "^3.3.1",
        "jss-extend": "6.2.0",
        "keycode": "2.2.0",
        "lodash": "4.17.10",
        "material-ui-pickers": "^1.0.0-rc.14",
        "mobile-detect": "1.4.2",
        "moment": "^2.22.2",
        "path-to-regexp": "2.2.1",
        "perfect-scrollbar": "1.4.0",
        "prismjs": "1.15.0",
        "qs": "6.5.2",
        "raw-loader": "0.5.1",
        "react": "16.4.2",
        "react-autosuggest": "9.3.4",
        "react-big-calendar": "0.19.2",
        "react-chartjs-2": "2.7.4",
        "react-dnd": "2.6.0",
        "react-dnd-html5-backend": "2.6.0",
        "react-dom": "16.4.2",
        "react-number-format": "3.5.1",
        "react-popper": "1.0.2",
        "react-redux": "5.0.7",
        "react-redux-i18n": "^1.9.3",
        "react-router-config": "1.0.0-beta.4",
        "react-router-dom": "4.3.1",
        "react-scripts": "1.1.4",
        "react-select": "2.0.0",
        "react-swipeable-views": "0.12.16",
        "react-table": "6.8.6",
        "react-text-mask": "5.4.3",
        "recharts": "^1.3.1",
        "redux": "4.0.0",
        "redux-api": "^0.11.2",
        "redux-form": "^7.4.2",
        "redux-thunk": "2.3.0",
        "rimraf": "^2.6.2",
        "sass-loader": "^7.1.0",
        "typeface-roboto": "0.0.54",
        "url-search-params-polyfill": "^5.0.0",
        "velocity-react": "1.4.1",
        "webpack-shell-plugin": "^0.5.0"
    },
    "devDependencies": {
        "@babel/cli": "^7.0.0-rc.1",
        "@babel/core": "^7.0.0-rc.1",
        "@babel/plugin-proposal-class-properties": "^7.0.0-rc.1",
        "@babel/plugin-transform-react-constant-elements": "^7.0.0-rc.1",
        "@babel/plugin-transform-react-inline-elements": "^7.0.0-rc.1",
        "@babel/plugin-transform-runtime": "^7.0.0-rc.1",
        "@babel/polyfill": "^7.0.0-rc.1",
        "@babel/preset-env": "^7.0.0-rc.1",
        "@babel/preset-react": "^7.0.0-rc.1",
        "autoprefixer": "9.1.0",
        "babel-loader": "^8.0.0-beta",
        "babel-plugin-lodash": "^3.3.2",
        "babel-plugin-react-transform": "^3.0.0",
        "babel-plugin-transform-react-pure-class-to-function": "^1.0.1",
        "babel-plugin-transform-react-remove-prop-types": "^0.4.15",
        "babel-preset-react-optimize": "^1.0.1",
        "compression-webpack-plugin": "^1.1.11",
        "cross-env": "5.2.0",
        "css-loader": "^1.0.0",
        "file-loader": "^2.0.0",
        "html-webpack-plugin": "^3.2.0",
        "js-beautify": "1.7.5",
        "marked": "0.4.0",
        "postcss": "^7.0.5",
        "postcss-cli": "^6.0.0",
        "react-hot-loader": "^4.3.4",
        "style-loader": "^0.22.1",
        "tailwindcss": "^0.6.6",
        "url-loader": "^1.1.1",
        "webpack": "^4.16.5",
        "webpack-cli": "^3.1.0",
        "webpack-dev-server": "^3.1.5"
    }
}

What is the problem?

I am running Windows 10 and Yarn 1.10.1

duncanmcclean commented 5 years ago

Are you running the command within the Command prompt or within Git bash?

Lory1990 commented 5 years ago

Command line

duncanmcclean commented 5 years ago

Try downloading the Git Shell. It's by far a better way of using the Terminal on Windows. I believe you can download it from here. https://git-scm.com/downloads

Lory1990 commented 5 years ago

Close enough... it said "postcss" is not recognized as internal or external command so i installed postcss and postcss-cli and it worked

..... I am puzzled....

duncanmcclean commented 5 years ago

Glad you got it sorted. :)