Does the current roadhog have a way to configure less-loader, in order to define globalVars

when the project component folder level is relatively deep, when the less file introduces the global less variable configuration file, you need to define a long relative path. For example, ".. / styles/variables" not only needs to calculate the level, but also needs to make changes accordingly when the file location is changed.

if you can define a global globalVar, such as @ src: "current webpack project directory" by configuring less-loader. Then import the less file @ {src} / styles/variables like this when referencing, and the coding will be more comfortable.

are there any current plans?

Dva.js
Apr.09,2021
The general idea of

is to extend the webpack configuration of roadhog by adding a webpack.config.js to the project directory. Add a .less file suffix to the extensions configured by resolve so that it can handle references to .less files.
by default, less-loader does not use webpack resolver for file parsing when the paths configuration is given. Therefore, the alias configuration is not valid in this case.

actual solution:
in roadhog configuration .webpackrc.js: 

alias: {
    '@': path.resolve('./src'),
    assets: path.resolve('./public/assets/'),
},

in webpack.config.js: 

module.exports = function(webpackConfig, env) {
  webpackConfig.resolve.extensions.push('.less');

  return webpackConfig;
};

.less file anywhere in the project: 

// ./src/styles/vars.less
@import '~@/styles/vars';

Previous: How to run the app made by h5 in the background

Next: Vue TypeScript uses vue-property-decorator to prompt router-view that it is not registered

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu