giuseppeg / giuseppeg/styled-jsx-plugin-sass

Next.js with sassOptions

Open
#38 2 comments 3 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
121
Forks
24
PR merge metrics
No merged PRs in 30d

Description

I am trying to pass sassOptions to Next.js (v9.1.5) and getting `The "request" argument must be of type string. Received type object`:
```
[ error ] ./node_modules/next/dist/client/dev/amp-dev.js
TypeError [ERR_INVALID_ARG_TYPE]: [BABEL] myproject\node_modules\next\dist\client\dev\amp-dev.js: The "request" argument must be of type string. Received type object (While processing: "myproject\\node_modules\\next\\babel.js")
at Array.map ()
at Array.reduce ()
```

babel.config.js without options works:
```
module.exports = function(api) {
api.cache(true);
const presets = [["next/babel",{"styled-jsx": {plugins: ["styled-jsx-plugin-sass"]}}]];
const plugins = [];
return {
presets,
plugins
};
};
```

babel.config.js with sassOptions causes the issue
```
module.exports = function(api) {
api.cache(true);
const presets = [["next/babel",{"styled-jsx": {plugins: ["styled-jsx-plugin-sass", {
sassOptions: {
includePaths: ["./styles"],
precision: 2
}
}
]}}]];
const plugins = [];
return {
presets,
plugins
};
};
```

Anyone have sassOptions working on Next.js? Is there a special way I need to pass sassOptions with Next.js?

Contributor guide

No contributing guide indexed for this repository

Research direction

Start with the reported babel.config.js examples and reproduce the error using Next.js v9.1.5, sassOptions, and styled-jsx-plugin-sass. Inspect how the next/babel preset processes the nested options and compare it with the working configuration. Done means sassOptions can be passed without the reported request-type error and the behavior is covered by a regression check.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, nextjs, sass
Domain
build-system, frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.