After migrating from Parcel v1 to v2, building the same react app (CRA) using parcel keeps failing to resolve Google fonts URL imported in stylesheet claiming its an unknown url scheme or pipeline 'https:' . Kindly help.
The line causing failure is
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap');
which I also attempted without the url() syntax like this
@import "https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap";
but still fails to build.
Here is a screenshot of the error Parcel v2 fails to resolve external url
Below is the package.json file for the app
{
"name": "live-chat-widget",
"version": "0.1.0",
"private": true,
"dependencies": {
"classnames": "^2.3.2",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"sass": "^1.54.9"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"build:widget": "parcel build src/index.js --no-source-maps --dist-dir docs"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"@parcel/transformer-sass": "2.7.0",
"parcel": "^2.7.0"
}
}