Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

npx sv create does not add prettier-plugin-tailwindcss to package.json and .prettierrc #220

Open
SymphonySimper opened this issue Oct 25, 2024 · 2 comments · Fixed by #221

Comments

@SymphonySimper
Copy link

SymphonySimper commented Oct 25, 2024

When you create a project with sv with prettier and tailwindcss options selected. It does not seem to add tailwind's prettier plugin. This only gets added if run npx sv add tailwind again after the project creation.

Same thing happens when you create a project with tailwind and without prettier. Now if you add prettier with npx sv add prettier. It does not add tailwind's prettier plugin. You have to again run npx sv add tailwind.

But adding tailwind again results with this app.css

--- a/src/app.css
+++ b/src/app.css
@@ -1,3 +1,6 @@
 @import 'tailwindcss/base';
 @import 'tailwindcss/components';
 @import 'tailwindcss/utilities';
+@import 'tailwindcss/base';
+@import 'tailwindcss/components';
+@import 'tailwindcss/utilities';

git diff of project with create and add

Click me Note: I have removed `package-lock.json` for simplification.
diff --git a/.prettierrc b/.prettierrc
index 3f7802c..7ebb855 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -3,7 +3,7 @@
 	"singleQuote": true,
 	"trailingComma": "none",
 	"printWidth": 100,
-	"plugins": ["prettier-plugin-svelte"],
+	"plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
 	"overrides": [
 		{
 			"files": "*.svelte",
diff --git a/package.json b/package.json
index 47529d0..c408054 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
 		"globals": "^15.0.0",
 		"prettier": "^3.3.2",
 		"prettier-plugin-svelte": "^3.2.6",
+		"prettier-plugin-tailwindcss": "^0.6.5",
 		"svelte": "^5.0.0",
 		"svelte-check": "^4.0.0",
 		"tailwindcss": "^3.4.9",
diff --git a/src/app.css b/src/app.css
index a31e444..3e0e682 100644
--- a/src/app.css
+++ b/src/app.css
@@ -1,3 +1,6 @@
 @import 'tailwindcss/base';
 @import 'tailwindcss/components';
 @import 'tailwindcss/utilities';
+@import 'tailwindcss/base';
+@import 'tailwindcss/components';
+@import 'tailwindcss/utilities';
@SymphonySimper SymphonySimper changed the title npx sv create does add prettier-plugin-tailwindcss to package.json and .prettierrc npx sv create does not add prettier-plugin-tailwindcss to package.json and .prettierrc Oct 25, 2024
@SymphonySimper
Copy link
Author

SymphonySimper commented Oct 25, 2024

This still doesn't seem to work in the case where you create a project with tailwind and later add prettier to it.

@manuel3108 manuel3108 reopened this Oct 25, 2024
@manuel3108
Copy link
Member

@AdrianGonz97 Mhmmm, that totally makes sense. But that would require us adding tailwindcss specific stuff to the prettier add-on. Do we want / need to support this use-case?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants