Conflict with app.config.compilerOptions.whitespace = 'preserve', lost whitespace.

yuanjinyong commented 4 months ago

In Vue SFC file, with the following code

<template>
  <jy-form-dialog ref="form" v-model:entity="entity" v-bind="options" max-col="4">
        <jy-form-item label="输入控件配置说明" col="2">
          <pre>
{
  "tag": "jy-dict", //
  "data": {
    "props": {
      "type": "radio", // 显示类型：radio、单选按钮；checkbox、多选按钮；其他取值为下拉框
      "dict": "Common_YesNo", // 字典编码或者字典项列表如：["所属机构", "系统名称", "不显示名称" ]
      "dataType": "String" // 如果取值为字符串，需要指定为为String，否则会当做数值类型处理
    }
  }
}</pre
          >
        </jy-form-item>
  </jy-form-dialog>
</template>

<script>
import {defineComponent} from 'vue'

export default defineComponent({
  name: 'SettingDetail'
})
</script>

And in vite.config.ts file, use this plugin

import {defineConfig} from 'vite'
import vue from '@vitejs/plugin-vue'
import PreprocessorDirectives from 'unplugin-preprocessor-directives/vite'

// https://vitejs.dev/config/
export default defineConfig((configEnv:any) => {
  return {
    plugins: [PreprocessorDirectives({ /* options */ }), vue()], // with PreprocessorDirectives plugin, the pre tag display not ok
    // plugins: [vue()] // use this line, the pre tag display ok
  }
})

I want to keep the whitespace in pre tag content for indentation display, if use PreprocessorDirectives plugin, the indentation lost.

I used following versions: "vue": "^3.4.24", "@vitejs/plugin-vue": "^5.0.4", "unplugin-preprocessor-directives": "^1.0.3", "vite": "^5.2.10",

KeJunMao commented 4 months ago

抱歉，最近没有时间来更新这个插件，您可以临时这样实现来保留缩进（运行时）：

<pre>{{ JSON.stringify({...}, null, 2) }}</pre>

yuanjinyong commented 4 months ago

通过JSON.stringify的方式，没法保留行尾的注释说明，这个本意是想通过样例说明讲解传达如何使用属性。

我现在临时通过 PreprocessorDirectives({include: /src\/common\/plugins\/./}) 的方式，仅包含极个别使用了条件宏定义的源码文件来规避过去。

KeJunMao / unplugin-preprocessor-directives

Conflict with app.config.compilerOptions.whitespace = 'preserve', lost whitespace. #10