App.vue introduces global less unavailability issues

less-loder has been installed

// theme.less

@wid:1000px;

// App.vue

<style lang="less">
@import "./style/theme.less";
</style>

// search.vue

<style lang="less" scoped>
.dataSearch {
  width: @wid;
}
</style>

Front-end webpack vue.js less

Mar.01,2021

sass-resources-loader needs to be installed.
find the utils.js under the build folder, find
less: generateLoaders ('less') and modify it to
less: generateLoaders (' less'). Concat ({

    loader: 'sass-resources-loader',
    options: {
      resources: path.resolve(__dirname, '../src/assets/css/1.less')
    }
}), 1.less

components need to introduce the file @ import'@ / assets/less/variable.less' separately in the component when using the less variable

may be compiled piece by piece at the time of compilation, so the occurrence of this variable does not recognize

should be written according to the module

you are missing this sentence:

"src
" webpack.base.conf.js

        {
            test: /\.less$/,
            loader: "style-loader!css-loader!less-loader"
         }

Previous: What are the ways in which the Vue child component interacts with the parent component?

Next: Problems running btcpool's test program