can not override config.styl globally

[fengxinming]

• I confirm that this is an issue rather than a question.

Bug report

Steps to reproduce

1. create a file 'config.styl'

$textColor = #000000

2. edit file '.vuepress/config.js`

{
  stylus: {
    import: ['config.styl']
  }
}

What is expected?

initialized $textColor #2c3e50 is replaced with #000000

What is actually happening?

nothing happens

Other relevant information

look up code in file @vuepress/core/lib/node/internal-plugins/palette/index.js

10    // 1. enable config.styl globally.
11    const configFile = ctx.getLibFilePath('client/style/config.styl')
12    if (!ctx.siteConfig.stylus) {
13      ctx.siteConfig.stylus = {
14        import: [configFile]
15      }
16    } else if (isPlainObject(ctx.siteConfig.stylus)) {
17      ctx.siteConfig.stylus.import = (ctx.siteConfig.stylus.import || []).concat([configFile])
18    }

I propose to amend the 17th lines of code

ctx.siteConfig.stylus.import = [configFile].concat(ctx.siteConfig.stylus.import || [])

[haoranpb]

Hi @fengxinming , are you trying to change the default preset varibles? Can you try to override them in the palette.styl as the document suggested?

[fengxinming]

@ludanxer I am going to develop a custom theme that base on theme-default like vuepress-theme-xxx, so I would like to override some default preset variables like

const path = require('path');

// Theme API.
module.exports = (options, ctx) => {
  const { themeConfig, siteConfig } = ctx;

  const stylusConfig = siteConfig.stylus || {};
  if (!Array.isArray(stylusConfig.import)) {
    stylusConfig.import = [];
  }
  stylusConfig.import.unshift(
    path.join(__dirname, 'styles', 'vue', '**', '*.styl')
  );
  siteConfig.stylus = stylusConfig;

in that case, client/style/config.styl will override custom preset variables

[meteorlxy]

Use palette.styl.

But it's somthing can be enhanced. See #2129

[fengxinming]

@meteorlxy 我主要想定制一套主题基于theme-default，我在主题的index.js里面覆盖掉预置变量，当我在其它的文档里面引入我的主题后，又可以通过覆盖我的样式，palette.styl这个主要被开发者定制，我在插件中不能覆盖。
I would like to customize a theme for vuepress，if people use the theme without palette.styl，then the custom theme will override default preset variables.

[meteorlxy]

themePath/styles/palette.styl is also supported.

See https://vuepress.vuejs.org/theme/writing-a-theme.html#directory-structure

[fengxinming]

@meteorlxy 不错，这个方式也行，我之前没有看到。不过这个自定stylus参数覆盖先后顺序的问题可以看看。

[bencodezen]

@fengxinming I agree that palette.styl is not the most intuitive considering it contains many more variables than simple color. This is something we will most likely have to change in the future.

In the meantime, did @meteorlxy help to solve your problem?