davidtheclark / davidtheclark/postcss-simple-extend
No parent could be found error when use @apply Tailwind classes
- Dominant language
- JavaScript
- Stars
- 34
- Forks
- 3
- PR merge metrics
- No merged PRs in 30d
Description
starting from this
webpack.mix.js
```
mix.js('resources/js/app.js', 'public/js')
.scripts([
'public/js/app.js',
'resources/js/includes/script.js'
], 'public/js/app.js')
.postCss('resources/css/app.css', 'public/css', [
require('postcss-import'),
require('tailwindcss'),
require('postcss-simple-extend'),
require('postcss-nested'),
require('autoprefixer'),
]);
```
resources/css/app.css
```
@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';
@import 'includes/thumbnails';
```
resources/css/includes/thumbnails.css
```
@define-placeholder thumbnail {
@apply relative overflow-hidden w-full sm:w-auto sm:max-w-lg sm:shadow-lg sm:border-4 sm:border-solid sm:border-white;
img {
@apply object-cover;
transition: transform 2s, filter 1.5s ease-in-out;
transform-origin: center center;
filter: brightness(0.7);
}
&:hover img { transform: scale(1.3); filter: brightness(1); }
}
.thumbnail-left {
@extend thumbnail;
@apply sm:float-left sm:mr-6;
}
.thumbnail-right {
@extend thumbnail;
@apply sm:float-right sm:ml-6;
}
```
I got errors
```
npm run dev
> dev
> npm run development
> development
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --config=node_modules/laravel-mix/setup/webpack.config.js
98% after emitting SizeLimitsPlugin
ERROR Failed to compile with 2 errors 9:22:20 PM
error in ./resources/css/app.css
Module build failed (from ./node_modules/css-loader/index.js):
ModuleBuildError: Module build failed (from ./node_modules/postcss-loader/src/index.js):
Error: No parent could be found
at /home/http/app/resources/css/includes/thumbnails.css:2:2
at findParent (/home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:218:9)
at /home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:228:33
at /home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:314:16
at /home/http/app/node_modules/postcss-import/node_modules/postcss/lib/container.js:139:18
at AtRule.each (/home/http/app/node_modules/postcss-import/node_modules/postcss/lib/container.js:105:16)
at AtRule.walk (/home/http/app/node_modules/postcss-import/node_modules/postcss/lib/container.js:135:17)
at /home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:152:24
at Root.each (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:105:16)
at Root.walk (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:135:17)
at Root.walkAtRules (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:312:17)
at processApplyAtRules (/home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:225:9)
at /home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:315:14
at LazyResult.run (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:288:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:212:26)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at /home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:254:14
at new Promise ()
at LazyResult.async (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:250:23)
at LazyResult.then (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:131:17)
at LazyResult.asyncTick (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:216:17)
at LazyResult.asyncTick (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:225:14)
at /home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:217:17
at /home/http/app/node_modules/webpack/lib/NormalModule.js:316:20
at /home/http/app/node_modules/loader-runner/lib/LoaderRunner.js:367:11
at /home/http/app/node_modules/loader-runner/lib/LoaderRunner.js:233:18
at context.callback (/home/http/app/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
at /home/http/app/node_modules/postcss-loader/src/index.js:208:9
error in ./resources/css/app.css
Module build failed (from ./node_modules/postcss-loader/src/index.js):
Error: No parent could be found
at /home/http/app/resources/css/includes/thumbnails.css:2:2
at findParent (/home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:218:9)
at /home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:228:33
at /home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:314:16
at /home/http/app/node_modules/postcss-import/node_modules/postcss/lib/container.js:139:18
at AtRule.each (/home/http/app/node_modules/postcss-import/node_modules/postcss/lib/container.js:105:16)
at AtRule.walk (/home/http/app/node_modules/postcss-import/node_modules/postcss/lib/container.js:135:17)
at /home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:152:24
at Root.each (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:105:16)
at Root.walk (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:135:17)
at Root.walkAtRules (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:312:17)
at processApplyAtRules (/home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:225:9)
at /home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:315:14
at LazyResult.run (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:288:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:212:26)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at /home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:254:14
at new Promise ()
at LazyResult.async (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:250:23)
at LazyResult.then (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:131:17)
at LazyResult.asyncTick (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:216:17)
at LazyResult.asyncTick (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:225:14)
at /home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:217:17
@ ./resources/css/app.css 2:14-142
Asset Size Chunks Chunk Names
/js/app.js 731 KiB /js/app [emitted] /js/app
ERROR in ./resources/css/app.css
Module build failed (from ./node_modules/css-loader/index.js):
ModuleBuildError: Module build failed (from ./node_modules/postcss-loader/src/index.js):
Error: No parent could be found
at /home/http/app/resources/css/includes/thumbnails.css:2:2
at findParent (/home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:218:9)
at /home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:228:33
at /home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:314:16
at /home/http/app/node_modules/postcss-import/node_modules/postcss/lib/container.js:139:18
at AtRule.each (/home/http/app/node_modules/postcss-import/node_modules/postcss/lib/container.js:105:16)
at AtRule.walk (/home/http/app/node_modules/postcss-import/node_modules/postcss/lib/container.js:135:17)
at /home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:152:24
at Root.each (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:105:16)
at Root.walk (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:135:17)
at Root.walkAtRules (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:312:17)
at processApplyAtRules (/home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:225:9)
at /home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:315:14
at LazyResult.run (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:288:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:212:26)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at /home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:254:14
at new Promise ()
at LazyResult.async (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:250:23)
at LazyResult.then (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:131:17)
at LazyResult.asyncTick (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:216:17)
at LazyResult.asyncTick (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:225:14)
at /home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:217:17
at /home/http/app/node_modules/webpack/lib/NormalModule.js:316:20
at /home/http/app/node_modules/loader-runner/lib/LoaderRunner.js:367:11
at /home/http/app/node_modules/loader-runner/lib/LoaderRunner.js:233:18
at context.callback (/home/http/app/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
at /home/http/app/node_modules/postcss-loader/src/index.js:208:9
@ ./resources/css/app.css
ERROR in ./resources/css/app.css (./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??postcss0!./resources/css/app.css)
Module build failed (from ./node_modules/postcss-loader/src/index.js):
Error: No parent could be found
at /home/http/app/resources/css/includes/thumbnails.css:2:2
at findParent (/home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:218:9)
at /home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:228:33
at /home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:314:16
at /home/http/app/node_modules/postcss-import/node_modules/postcss/lib/container.js:139:18
at AtRule.each (/home/http/app/node_modules/postcss-import/node_modules/postcss/lib/container.js:105:16)
at AtRule.walk (/home/http/app/node_modules/postcss-import/node_modules/postcss/lib/container.js:135:17)
at /home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:152:24
at Root.each (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:105:16)
at Root.walk (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:135:17)
at Root.walkAtRules (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/container.js:312:17)
at processApplyAtRules (/home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:225:9)
at /home/http/app/node_modules/tailwindcss/lib/lib/substituteClassApplyAtRules.js:315:14
at LazyResult.run (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:288:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:212:26)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at LazyResult.asyncTick (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:225:14)
at /home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:254:14
at new Promise ()
at LazyResult.async (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:250:23)
at LazyResult.then (/home/http/app/node_modules/tailwindcss/node_modules/postcss/lib/lazy-result.js:131:17)
at LazyResult.asyncTick (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:216:17)
at LazyResult.asyncTick (/home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:225:14)
at /home/http/app/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:217:17
@ ./resources/css/app.css 2:14-142
```
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.