Note: vous pouvez vous référer à l’article: [Webpack Encore] Utiliser la méthode addAliases pour résoudre les problèmes de sous-imports de fichiers sass/scss à l’utilisation de… Lire la suite »[Webpack Encore] Résoudre les problèmes d’imports et de sous-imports de composants JS à l’utilisation de frameworks comme UiKit ou Foundation 6
Source: Webpack sass loader resolve absolute path /webpack.config.js:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
const path = require('path'); const Encore = require('@symfony/webpack-encore'); [...] Encore .addAliases({ '@uk': path.resolve(__dirname, './node_modules/uikit/src/scss'), '@uk-components': path.resolve(__dirname, './node_modules/uikit/src/scss/components'), '@uk-theme': path.resolve(__dirname, './node_modules/uikit/src/scss/theme') }) [...] |
/assets/styles/apps.scss.
|
1 2 3 4 5 6 7 8 |
// @import uikit // https://getuikit.com/docs/sass#how-to-build // @import your custom variables and variables overwrites here. @import "~uikit/src/scss/variables.scss"; // @import your custom mixin overwrites here. @import "~uikit/src/scss/mixins.scss"; @import "~uikit/src/scss/uikit.scss"; // Cherche d'abord l'existence d'une surcharge (./assets/styles/uikit/src/scss/uikit.scss) avant de pointer vers ./node_modules/uikit/src/scss/uikit.scss |
ATTENTION: afin que le principe de fallback décrit dans l’exemple (surcharge si existante, sinon… Lire la suite »[Webpack Encore] Utiliser la méthode addAliases pour résoudre les problèmes de sous-imports de fichiers sass/scss à l’utilisation de frameworks comme UiKit ou Foundation 6
ATTENTION: Testé fonctionnel (moyennant mes ajustements ci-dessous) sur les bases de la demo officielle de Pimcore qui tournait, au moment de mes tests, sous Pimcore… Lire la suite »[Pimcore] Utiliser le Bundle Webpack Encore de Symfony