Syntax Error: Error: Loading PostCSS Plugin failed: Cannot find module 'tailwindcss'
See original GitHub issue ERROR Failed to compile with 1 error 20:44:08
error in ./src/assets/tailwind.css
Syntax Error: Error: Loading PostCSS Plugin failed: Cannot find module 'tailwindcss'
Every couple of weeks I’ve been trying to upgrade to the latest version of the plugin but I get this error everytime.
I ran the following:
npm update
vue upgrade
Name Installed Wanted Latest Command to upgrade
vue-cli-plugin-tailwind 1.4.2 1.4.2 2.0.5 vue upgrade vue-cli-plugin-tailwind
Previously it wasn’t required to install Tailwind separately, is this now a requirement? If it is could it be added to the docs?
Furthermore, this is the current contents of postcss.config.js
:
module.exports = {
plugins: {
tailwindcss: {},
'vue-cli-plugin-tailwind/purgecss': {},
autoprefixer: {},
},
};
Does anything in here need to change in order to upgrade too? Really struggling to understand how to upgrade.
Issue Analytics
- State:
- Created 3 years ago
- Comments:9 (2 by maintainers)
Top Results From Across the Web
Loading PostCSS Plugin failed: Cannot find module 'tailwindcss'
The package is tailwindcss not tailwind : npm install -D tailwindcss postcss autoprefixer vite npm tailwindcss init.
Read more >Cannot find module 'tailwindcss' error | bobbyhadz
To solve the error "Cannot find module 'tailwindcss'", install tailwindcss , postcss and autoprefixer as dev dependencies in your project by running npm...
Read more >Error: Loading PostCSS Plugin failed: Cannot find module 
Expected behavior. I expected it to work. Actual behavior. Failed to compile. ./node_modules/mdbvue/lib/css/mdb.min.css (.
Read more >PostCSS - "Error: cannot find module 'tailwindcss'" - HUGO
Hi, I started from a new site: $ hugo new site foo $ cd foo $ hugo mod init foo added this to...
Read more >Install Tailwind CSS using PostCSS
Installing Tailwind CSS as a PostCSS plugin is the most seamless way to integrate it with build tools like webpack, Rollup, Vite, and...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
You need to install the PostCSS 7 compatibility build of Tailwind CSS:
This is not necessary when running
vue add tailwind
in a new project, only when upgrading.Also, remove
'vue-cli-plugin-tailwind/purgecss': {},
from yourpostcss.config.js
and configure PurgeCSS insidetailwind.config.js
:I encountered this error after updating the plugin from 2.0.1 to 2.0.6 and re-installing the plugin was the easiest solution. Specific steps I took:
npm uninstall vue-cli-plugin-tailwind
vue add tailwind
- For the config file option I selectednone
since I already had onenpm install