# FAQ

# 为什么不能把 palette.styl 和 index.styl 合并到一个 API?

palete.styl 负责全局颜色设置。在编译期间，主题颜色常量应该首先由预处理器解析，然后应用于全局上下文。

但对于 index.styl，它的工作是重写应用的默认样式。根据 CSS 的优先级原则，后一种样式具有更高的优先级，因此应该在 CSS 文件的末尾生成。

描述 stylus 编译器编译顺序的简单图表如下：

@flowstart
阶段1=>操作: palette.styl
阶段2=>操作: 默认 app 样式
阶段3=>操作: index.styl

阶段1->阶段2->阶段3
@flowend

# What's the differences between the clientDynamicModules and enhanceAppFiles?

To be translated.

Let's take a look back first, both clientDynamicModules and enhanceAppFiles can generate modules with dynamic javascript code during compile time.

The difference is that the files generated by enhanceAppFiles will be loaded and applied automatically when the application is initialized on the client side. While the files generated by clientDynamicModules needs to be imported as @dynamic/xxx by the users themselves.

module.exports = (options, ctx) => ({
  // Import by entry file automatically.
  enhanceAppFiles: {
    name: 'constans-a',
    content: `...`
  },

  // Need to use via: import '@dynamic/constans-b'
  clientDynamicModules() {
    return {
      name: 'constans-b',
      content: `...`
    }
  }
})

# When do I need to use enhanceAppFiles?

1. I want to execute some code on the client side automatically.
2. I don't have need for reuse of this module.

Example:

• @vuepress/plugin-register-components: Automatically registering components on the client side.
• @vuepress/plugin-pagination: Automatically insert Vue plugins to expand the API of the client.

# When do I need to use clientDynamicModules?

1. I want to generate a dynamic module that needs to be invoked at a specific time.
2. I want to use this module in different modules.

Example:

• @vuepress/plugin-blog: Using compile-time metadata to generate some dynamic blog-related modules and initialize them on the client side by using enhanceAppFiles.