Блог

Мне нужно использовать условную компиляцию для моего проекта, и я пытаюсь установить эту библиотеку под названием ifdef-loader. Я знаю, что для установки требуется файл webpack.config.json, который отсутствует в моей среде Vue. После исследования я обнаружил, что вместо этого можно использовать vue.config.json. Я создал этот файл в каталоге своего проекта и использовал эту настройку:

 const opts = {
    DEBUG: true,
    version: 3,
    "ifdef-verbose": true,                 // add this for verbose output
    "ifdef-triple-slash": false,           // add this to use double slash comment instead of default triple slash
    "ifdef-fill-with-blanks": true,         // add this to remove code with blank spaces instead of "//" comments
    "ifdef-uncomment-prefix": "// #code "  // add this to uncomment code starting with "// #code "
 };
 
module.exports = { 
    configureWebpack: {
        test: /.tsx?$/, 
        exclude: /node_modules/, 
        use: [
           { loader: "ts-loader" }, 
           { loader: "ifdef-loader", options: opts } 
        ]
    },
    
 }
 

Как я использую библиотеку в своем коде. Действительно простой пример использования логического значения для отображения/скрытия определенного текста:

 <template>
  <p>Lorem ipsum dolor sit amet.</p>
  // #if name
    <p>Lorem ipsum dolor sit.</p>
  // #endif
</template>

<script>
export default {
  name: 'App',
  setup() {
    const name = "example"

    return {
      name
    }
  }
}
</script>
 

Однако в моем приложении ничего не происходит, условный код /// просто отображается в виде обычного текста без каких-либо функций.

Не уверен, правильно ли я его настраиваю, но я был бы очень признателен за некоторые указания.

взгляните на эту библиотеку, она позволяет выполнять условную предварительную обработку:

js-условный-загрузчик компиляции