添加 crypto-browserify、stream-browserify 和 vm-browserify 依赖,支持项目中的浏览器环境兼容性。
vite 配置如下
const vueConfig = {
// publicPath:'./',
configureWebpack: {
resolve: {
fallback: {
"crypto": require.resolve("crypto-browserify"),
"stream": require.resolve("stream-browserify"),
"vm": require.resolve("vm-browserify")
}
},
plugins: [
new webpack.IgnorePlugin({
contextRegExp: /^\.\/locale$/,
resourceRegExp: /moment$/
}),
new webpack.DefinePlugin({
APP_VERSION: `"${packageJson.version}"`,
GIT_HASH: JSON.stringify(getGitHash()),
BUILD_DATE: buildDate
})
]
},
chainWebpack: config => {
config.resolve.alias.set('@$', resolve('src'))
// fixed svg-loader by https://github.com/damianstasik/vue-svg-loader/issues/185#issuecomment-1126721069
const svgRule = config.module.rule('svg')
config.module.rules.delete('svg')
config.module.rule('svg')
.oneOf('svg_as_component')
.resourceQuery(/inline/)
.test(/\.(svg)(\?.*)?$/)
.use('babel-loader')
.loader('babel-loader')
.end()
.use('vue-svg-loader')
.loader('vue-svg-loader')
.options({
svgo: {
plugins: [
{ prefixIds: true },
{ cleanupIDs: true },
{ convertShapeToPath: false },
{ convertStyleToAttrs: true }
]
}
})
.end()
.end()
},
css: {
loaderOptions: {
less: {
modifyVars: {
'primary-color': '#c20000',
'border-radius-base': '2px'
},
javascriptEnabled: true
}
},
extract: false
},
devServer: {
},
productionSourceMap: false,
lintOnSave: undefined,
}