在小程序開發(fā)過程中經(jīng)常使用的主題顏色事镣，頭部高度等，這些經(jīng)常使用的可以使用less寫成全局變量揪胃。但在使用時(shí)碰到一些問題璃哟，在APP.vue中全局引入定義了變量的less文件在單個(gè)頁面中使用這些變量會(huì)報(bào)undefined錯(cuò)誤，在單個(gè)頁面中引入則不會(huì)喊递，此處為解決辦法
需要安裝sass-resources-loader随闪。
npm install sass-resources-loader --save-dev
然后找到build文件夾下面的 utils.js 找到
less: generateLoaders('less')
位置
return {
css: generateLoaders(),
wxss: generateLoaders(),
postcss: generateLoaders(),
less: generateLoaders('less').concat({ // 此處為需要修改位置
loader: 'sass-resources-loader',
options: {
resources: path.resolve(__dirname, '../src/styles/reset.less')
}
}),
sass: generateLoaders('sass', { indentedSyntax: true }),
scss: generateLoaders('sass'),
stylus: generateLoaders('stylus'),
styl: generateLoaders('stylus')
}
}
修改成
less: generateLoaders('less').concat({
loader: 'sass-resources-loader',
options: {
resources: path.resolve(__dirname, '../src/assets/base.less') // 此處為你需要全局引入的less文件地址
}
})
