526互联

vue自动去掉html双引号的问题

发布时间 2023-07-13 10:11:45作者: gds通用软件开发系统

解决vue项目打包后index.html标签属性没有双引号的问题

问题:编译发布后html中的双引号丢失

在vue.config.js 中

查看网上的写法,编译发布可以,但是本地调试执行报错

 1 chainWebpack: config => {
 2     config.resolve.alias
 3     .set('@', resolve('src')) // key,value自行定义，比如.set('@@', resolve('src/components'))
 4     .set('@c', resolve('src/components'));
 5     config.plugins.delete('prefetch');
 6     config.plugins.delete('preload-search');
 7     //解决打包head里标签属性没有双引号
 8     config.plugin('html')
 9     .tap(args => {
10         args[0].minify.removeAttributeQuotes = false;
11         return args;
12     });
13 },

 

新增红色文字

chainWebpack: (config) => {
    config.resolve.alias
      .set('~', resolve('src/utils/custom'))
      .set('@', resolve('src'));
    config.plugin('define').tap((definitions) => {
      Object.assign(definitions[0]['process.env'], {
        REQUEST_URL: `"${PZ.REQUEST_URL}"`,
        URL: `"${PZ.URL}"`,
        REQUESTCONACT_URL: `"${PZ.REQUESTCONACT_URL}"`,
        FILE_URL: `"${PZ.FILE_URL}"`,
        IMAGE_DOWNLOAD: `"${PZ.IMAGE_DOWNLOAD}"`,
        IMAGE_DOWNLOAD_OLD: `"${PZ.IMAGE_DOWNLOAD_OLD}"`,
        UPLOAD_EXCEL: `"${PZ.UPLOAD_EXCEL}"`,
        UPLOAD_EXCEL_CS: `"${PZ.UPLOAD_EXCEL_CS}"`,
        EXCEL_DOWN_TEMPL_API: `"${PZ.EXCEL_DOWN_TEMPL_API}"`,
        USER_SENTRY: PZ.USER_SENTRY,
        USER_ENVIRONMENT: `"${PZ.ENVIRONMENT}"`,
        LOGIN_UN: `"${PZ.LOGIN_UN}"`,
        QTGO_URL: `"${PZ.QTGO_URL}"`,
      });
      config.plugin('html').tap((args) =>{
        args[0].minify = {
          ...args[0].minify,
          removeAttributeQuotes: false,
        }
        return args
      });
      return definitions;
    });
  },