Skip to content

Instantly share code, notes, and snippets.

@nobiit
Last active September 5, 2019 21:39
Show Gist options
  • Save nobiit/90da5942c1e2721744342bc1822af807 to your computer and use it in GitHub Desktop.
Save nobiit/90da5942c1e2721744342bc1822af807 to your computer and use it in GitHub Desktop.
[laravel-mix] Fix /deep/ in css of vue
https://github.com/JeffreyWay/laravel-mix/issues/1850#issuecomment-528527499
Hi everyone, here is the solution:
```js
mix.options({
postCss: [
postcss.plugin('deepCssVueScoped', () => {
let sign = '[deep]';
return function (root, result) {
root.walkRules((rule) => {
if (~rule.selector.indexOf(sign)) {
rule.selector = rule.selector.replace(sign, '/deep/');
}
});
};
})
]
});
```
And use it as follows:
```scss
.auth {
display: flex;
[deep] .auth-container {
position: relative;
.auth-title {
.logo {
height: 100px;
width: 100px;
}
}
}
}
```
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment