ashehzadgec commented 3 years ago

🐛 bug report

No matter what I do this error just does not go. undefined:undefined: PostCSS plugin postcss-modules requires PostCSS 8.

I upgraded postcss and downgraded the autoprefixer to v9, installed as dev dependency and as project dependency but nothing solved this issue. It always mention the following link below the above error. https://github.com/postcss/postcss/wiki/PostCSS-8-for-end-users

But parcel v2/nightly is not stable yet, I just can't take risk with it.

🎛 Configuration (.babelrc, package.json, cli command)

{
    "name": "nisar-sons-copy",
    "version": "1.0.0",
    "description": "",
    "main": "main.js",
    "scripts": {
        "dev": "parcel index.html",
        "build": "parcel build index.html --no-source-maps"
    },
    "author": "",
    "license": "ISC",
    "devDependencies": {
        "autoprefixer": "^9.8.6",
        "parcel-bundler": "^1.12.4",
        "parcel-plugin-bundle-visualiser": "^1.2.0",
        "parcel-plugin-custom-dist-structure": "^1.1.16",
        "postcss": "^8.2.6",
        "postcss-modules": "^4.0.0",
        "sass": "^1.32.7"
    },
    "customDistStructure": {
        "config": {
            ".css": "/assets/style",
            ".js": "/assets/js",
            "/assets/images": [
                ".jpg",
                ".png"
            ],
            "/assets/icons": [
                ".svg"
            ]
        },
        "options": {
            "development": true
        }
    },
    "dependencies": {
        "@swup/a11y-plugin": "^1.0.0",
        "@swup/debug-plugin": "^1.0.3",
        "@swup/js-plugin": "^1.0.4",
        "@swup/preload-plugin": "^1.0.3",
        "@swup/progress-plugin": "^1.0.0",
        "gsap": "^3.6.0",
        "imagesloaded": "^4.1.4",
        "lazysizes": "^5.3.0",
        "locomotive-scroll": "^4.0.7",
        "splitting": "^1.0.6",
        "swup": "^2.0.14"
    }
}

🤔 Expected Behavior

parcel should build without error.

😯 Current Behavior

I am getting this error :

PostCSS plugin postcss-modules requires PostCSS 8.
Migration guide for end-users:
https://github.com/postcss/postcss/wiki/PostCSS-8-for-end-users

💁 Possible Solution

🔦 Context

I cant get vendor prefixes for SAAS.

💻 Code Sample

🌍 Your Environment

Software	Version(s)
Parcel	1.12
Node

Screenshot 2021-03-03 135524 14.15.4-x64 | npm/Yarn | npm | Operating System | windows 10

ezekg commented 3 years ago

Install postcss-modules v3.2.2 instead of v4.

ashehzadgec commented 3 years ago

Thanks for the reply. Actually , I solved it through this solution. I think it is not a version problem. The problem is on this page ('https://parceljs.org/css.html') as in the attached file and with autoprefixer version 10. The plugin configuration shown here did not work for me. My solution to this problem is as follows in the postsccrc file.

{ "plugins": { "autoprefixer": { grid: 'autoplace' } } }

After changing that it worked out with autoprefixer v 9.0.0. I hope this may be helpful for other people as many were posting this question on the forum. So sharing with you.

I asked another question on the forum but did not get a reply. The question was parcel bundler is loading all the images from the whole website including from all other pages except lazy load images. Is this a normal behavior of the parcel bundler or what it could be or how I can avoid it.

Attached is my configuration for your kind reference and hope to receive a reply sooner than before.

Regards, Shehzad Asif

On Wed, Mar 10, 2021 at 10:17 PM Zeke Gabrielse @.***> wrote:

Install postcss-modules v3.2.2 instead of v4.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/parcel-bundler/parcel/issues/5957#issuecomment-795764975, or unsubscribe https://github.com/notifications/unsubscribe-auth/APQYRBQLQV4N24YDSPQ4KFTTC6LQZANCNFSM4YQZ6DLQ .

github-actions[bot] commented 3 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 14 days if no further activity occurs.

yuanlllshuai commented 1 year ago

upgrade parcel 2 1.yarn remove parcel 2.yarn add parcel@nightly 3.index.html:
add the type="module" attribute https://github.com/postcss/postcss/wiki/PostCSS-8-for-end-users

parcel-bundler / parcel

undefined:undefined: PostCSS plugin postcss-modules requires PostCSS 8. #5957