cssinjs / cssinjs/aphrodite-jss
[bug?] Warning: [JSS] Could not find the referenced rule logoAndCopyright in aphrodite-jss.
- Dominant language
- JavaScript
- Stars
- 94
- Forks
- 14
- PR merge metrics
- No merged PRs in 30d
Description
I've got some styles using jss-nested with `$classname` syntax:
```js
const style = StyleSheet.create({
footer: {
// ...
'& $logoAndCopyright': {
// ...
},
},
logoAndCopyright: {},
})
```
then when I use it,
```js
css(style.logoAndCopyright)
```
I get an error like
```
Warning: [JSS] Could not find the referenced rule logoAndCopyright in aphrodite-jss.
```
Full output:
```
Warning: [JSS] Could not find the referenced rule logoAndCopyright in aphrodite-jss.
| warning | @ | _app.js:26063
-- | -- | -- | --
| (anonymous) | @ | _app.js:1331
| onProcessStyle | @ | _app.js:1393
| onProcessStyle | @ | _app.js:3186
| onProcessRule | @ | _app.js:3171
| addRule | @ | _app.js:3759
| css | @ | _app.js:211
| render | @ | _app.js:26170
| finishClassComponent | @ | main.js:24135
| updateClassComponent | @ | main.js:24097
| beginWork | @ | main.js:24766
| performUnitOfWork | @ | main.js:26805
| workLoop | @ | main.js:26844
| renderRoot | @ | main.js:26884
| performWorkOnRoot | @ | main.js:27502
| performWork | @ | main.js:27424
| performSyncWork | @ | main.js:27396
| requestWork | @ | main.js:27296
| scheduleWork$1 | @ | main.js:27160
| scheduleRootUpdate | @ | main.js:27727
| updateContainerAtExpirationTime | @ | main.js:27754
| updateContainer | @ | main.js:27781
| module.exports.webpackJsonp.../node_modules/react-dom/cjs/react-dom.development.js.ReactRoot.render | @ | main.js:28064
| (anonymous) | @ | main.js:28204
| unbatchedUpdates | @ | main.js:27621
| legacyRenderSubtreeIntoContainer | @ | main.js:28200
| hydrate | @ | main.js:28256
| renderReactElement | @ | main.js:6559
| _callee5$ | @ | main.js:6534
| tryCatch | @ | main.js:30206
| invoke | @ | main.js:30440
| prototype.(anonymous function) | @ | main.js:30258
| step | @ | main.js:166
| _next | @ | main.js:181
| (anonymous) | @ | main.js:188
| F | @ | main.js:1500
| (anonymous) | @ | main.js:161
| _doRender | @ | main.js:6551
| doRender | @ | main.js:6433
| _callee2$ | @ | main.js:6339
| tryCatch | @ | main.js:30206
| invoke | @ | main.js:30440
| prototype.(anonymous function) | @ | main.js:30258
| step | @ | main.js:166
| _next | @ | main.js:181
| (anonymous) | @ | main.js:188
| F | @ | main.js:1500
| (anonymous) | @ | main.js:161
| _render | @ | main.js:6369
| render | @ | main.js:6311
| _callee$ | @ | main.js:6290
| tryCatch | @ | main.js:30206
| invoke | @ | main.js:30440
| prototype.(anonymous function) | @ | main.js:30258
| step | @ | main.js:166
| _next | @ | main.js:181
| Promise.then (async) | |
| step | @ | main.js:176
| _next | @ | main.js:181
| Promise.then (async) | |
| step | @ | main.js:176
| _next | @ | main.js:181
| Promise.then (async) | |
| step | @ | main.js:176
| _next | @ | main.js:181
| (anonymous) | @ | main.js:188
| F | @ | main.js:1500
| (anonymous) | @ | main.js:161
| ../node_modules/next/dist/client/next-dev.js | @ | main.js:6592
| __webpack_require__ | @ | manifest.js:715
| fn | @ | manifest.js:118
| 0 | @ | main.js:35329
| __webpack_require__ | @ | manifest.js:715
| webpackJsonpCallback | @ | manifest.js:26
| (anonymous) | @ | main.js:2
```
Contributor guide
No contributing guide indexed for this repository
Research direction
No repository file or test is named. Start by reproducing the StyleSheet.create and css(style.logoAndCopyright) example, then trace how jss-nested resolves the $classname reference; done means the nested style works without the referenced-rule warning.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100