why dont we now install lib such as postcss and autoprfixers with tailwind css on CRA
Now If I go to Tailwind docs for installtion of tailwind into my react app which has been
created with CRA
https://tailwindcss.com/docs/guides/create-react-app
npm install -D tailwindcss
npx tailwindcss init
but if my memory serves right it used to be
npm install -D tailwindcss autoprefixer postcss
npx tailwindcss init
You are correct. According to this commit Tailwind has changed the installation guide.
They did this to discourage using CRA more since there are better tools out there to create a React app. For example Vite
From the Install Tailwind CSS with Create React App
Create React App does not support custom PostCSS configurations
When using Vite the Tailwind docs do say to install postcss and autoprefixer
npm create vite#latest my-project -- --template react
cd my-project
npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p
Related
nextjs 13 has been released but when I create a new project I only want to use nextjs version 12, how can I do that?
All the install commands on the nextjs doc are creating a project folder with nextjs 13.
https://nextjs.org/docs
you can run this
npx create-next-app && cd myApp && npm i -S next#12
or this
npx create-next-app and then change next version to 12 from package.json manually
I am trying to install tailwind v3 in a vue 3 project(vue-cli) using the tailwind doc guide, my postcss in the dev dependencies is >8 yet when I serve the app, I get an error tailwindcss requires postcss 8.
it's fine working with vue-add-tailwind plugin but that only installs older versions of tailwindcss and I need to install tailwind v3
Im following the documentation but im stuck right at the npx tailwindcss init
https://tailwindcss.com/docs/installation
Check if your directory is initialized as a node project, i.e. it contains package.json file. If not then do this:
$/> npm init -y
Install tailwindcss as a dev dependency (optional as a dev dependency)
$/> npm i -D tailwindcss
Step : 1
Correct you directory path like this C:\Users\user\Documents\Web Dev\Tailwindcss_AlpineJs\pratice tailwind then try this command npx tailwindcss init
Step : 2
Not working above step : 1 then try this command : npx tailwindcss-cli#latest init -p.
I added tailwindcss 3 to the vue-sfc-rollup project but it doesn't work
ERROR Failed to compile with 1 error
error in ./dev/index.css
Syntax Error: Error: PostCSS plugin tailwindcss requires PostCSS 8.
Migration guide for end-users:
https://github.com/postcss/postcss/wiki/PostCSS-8-for-end-users
Try:
npm uninstall tailwindcss postcss autoprefixer
npm install -D tailwindcss#npm:#tailwindcss/postcss7-compat postcss#^7 autoprefixer#^9
Once the rest of your tools have added support for PostCSS 8, you can
move off of the compatibility build by re-installing Tailwind and its
peer-dependencies using the latest tag:
npm uninstall tailwindcss
npm install -D tailwindcss#latest postcss#latest autoprefixer#latest
For more information see here
So I have a Typescript project called backend with a depedency like such in its package.json:
"dependencies": {
"#the-couple-game/helpers": "^1.0.0",
}
And helpers (also Typescript) is in another folder with its package.json like such:
{
"name": "#the-couple-game/helpers",
}
So running lerna bootstrap should link the two and install #the-couple-game/helpers in backend's node_modules which it does locally.
However, doing the same (with --no-ci because I don't want npm ci) using Codebuild using the below buildspec.yml does not add a #the-couple-game/helpers in backend's node_modules. So if I run backend's transpiled index.js it would complain about the missing module.
version: 0.1
phases:
install:
commands:
- npm install -g lerna
pre_build:
commands:
- lerna bootstrap --no-ci --concurrency 4
build:
commands:
- lerna run build --concurrency 4
artifacts:
files:
- "**/*"
For now, I have to resort to manually doing a lerna bootstrap after deployment to CodeDeploy (using a script called from appspec.yml) so it installs the missing module but shouldn't Codebuild have covered that part?
Thanks.
So it turns out AWS CodePipeline doesn't support symlinks in source (Codebuild in my case). Reference
So after deployment, I'll have to lerna link using a shell script to create the links which is not an expensive job for my micro ec2 instance to do.