uniapp 动态配置 appid

处理JSONC文件

UniApp的mainfest.json是一个jsonc文件,可以使用comment-json库来处理

npm i comment-json --dev

读写mainfest.json

// injectAppID.js
const { parse, stringify } = require('comment-json')
const fs = require('fs')

// 环境修改 appid
let appid = process.env.VUE_APP_ID
console.log(appid)

// manifest.json 路径
let manifestFileUrl = `${__dirname}/src/manifest.json`

// 读取文件数据
let manifestFileData = fs.readFileSync(manifestFileUrl, {
  encoding: 'utf8'
})

// 解析 JSONC 文件
let manifestFileDataObj = parse(manifestFileData)

// 修改指定key对应的value
manifestFileDataObj['mp-weixin']['appid'] = appid

// 将 JSON 对象转换为 JSONC 格式并写入文件
fs.writeFileSync(manifestFileUrl, stringify(manifestFileDataObj, null, 2), {
  encoding: 'utf8'
})

在webpack环境下执行js

因为process.env.VUE_APP_ID只有在webpack环境下才能正常读取所以需要在vue.config.js中执行

const { defineConfig } = require('@vue/cli-service')
// 根据环境变量文件中的VUE_APP_ID修改mainfest.json的配置
require('./injectAppID.js')
module.exports = defineConfig({
  // 选项
})