Stylesheets placed in `styles` directory aren't referenced/used on website

[fanninpm]

Summary

I made a stylesheet: styles/website.css. This stylesheet should be referenced on the website.

• HonKit version: 3.5.1

Steps to reproduce

1. Install HonKit and run yarn run honkit init
2. Do something that would normally be styled by CSS (e.g., add an img tag with a certain class attribute).
3. Create a styles/website.css file and add to it.
4. Create a book.json file with contents below.
5. Run yarn run honkit serve and navigate to the appropriate webpage.

• Link to code example:

book.json contents

```json {} ```

package.json contents

```json { "name": "honkit-demo", "version": "1.0.0", "main": "index.js", "license": "MIT", "dependencies": { "honkit": "^3.5.1" }, "scripts": { "build": "honkit build", "serve": "honkit serve" } } ```

Directory structure

``` . ├── README.md ├── SUMMARY.md ├── _book ├── book.json ├── node_modules ├── package.json ├── styles └── yarn.lock 3 directories, 5 files ```

Expected results

The stylesheet should be included in the HTML source code, with its style changes being implemented onto the site.

Actual results

The stylesheet is not included in the HTML source code.

Output of $ yarn run build --log=debug

``` yarn run v1.22.4 $ honkit build --log=debug debug: readme found at README.md debug: summary file found at SUMMARY.md debug: cleanup folder "/Users/padraicfanning/Documents/honkit-demo/_book" info: 5 plugins are installed info: 5 explicitly listed info: plugin "highlight is loaded info: plugin "search is loaded info: plugin "lunr is loaded info: plugin "fontsettings is loaded info: plugin "theme-default is loaded info: found 1 pages info: found 3 asset files debug: calling hook "config" debug: calling hook "init" debug: copy assets from theme /Users/padraicfanning/Documents/honkit-demo/node_modules/@honkit/honkit-plugin-theme-default/_assets/website debug: copy resources from plugin /Users/padraicfanning/Documents/honkit-demo/node_modules/gitbook-plugin-fontsettings/assets debug: copy resources from plugin /Users/padraicfanning/Documents/honkit-demo/node_modules/gitbook-plugin-lunr/assets debug: copy resources from plugin /Users/padraicfanning/Documents/honkit-demo/node_modules/gitbook-plugin-search/assets debug: copy resources from plugin /Users/padraicfanning/Documents/honkit-demo/node_modules/gitbook-plugin-highlight/css debug: copy asset "package.json" debug: copy asset "styles/website.css" debug: copy asset "yarn.lock" debug: calling hook "finish:before" debug: calling hook "finish" debug: write search index info: >> generation finished with success in 1.9s ! ✨ Done in 8.41s. ```

[azu]

Thanks for report.

I've confirmed it.

📝 We have renmaed theme-default to @honkit/honkit-plugin-theme-default. It seems that honkit can not pass pluginConfig to scoped name package. https://github.com/honkit/honkit/blob/1a9cbf96860f03237d09e99a3a8dd6bae99d16c3/packages/honkit/src/plugins/PluginResolver.js#L7-L9 logic is wrong.

[azu]

I figure out it. @honkit/honkit-plugin-theme-default does not includes index.js. https://github.com/honkit/honkit/blob/29424f3296eecd8267dc80edaa46127af3460fd7/packages/%40honkit/theme-default/package.json#L25-L30

I'll fix this

[azu]

We have released https://github.com/honkit/honkit/releases/tag/v3.5.2. It will fix this issue.

Please try it :)

npm install honkit@latest
npx honkit build --reload

[milahu]

same problem with honkit 3.6.13: styles/website.css is ignored

content:

/* make navigation more compact */
.book-summary ul.summary li a, .book-summary ul.summary li span {
  padding: 1px 5px;
}

this should work, right?

i have { root: './src' } in my book.json

to reproduce:

```sh #!/bin/bash # migrate radare2book from gitbook to honkit git clone --depth 1 https://github.com/radareorg/radare2book.git cd radare2book npm uninstall gitbook-cli npm install -D honkit sed -i 's/": "gitbook /": "honkit /' package.json # convert book.toml to book.json npm i -D toml node >book.json <<'EOF' console.log(JSON.stringify({ ...require('toml').parse( require('fs').readFileSync('book.toml', 'utf8') ), "root": "./src", "pluginsConfig": { "theme-default": { "showLevel": true } }, }, null, 2)) EOF git rm book.toml git add book.json npm rm toml # fix theme - always show book title in header npm i -D @honkit/honkit-plugin-theme-default mkdir _layouts/website cp node_modules/@honkit/honkit-plugin-theme-default/_layouts/website/header.html _layouts/website/ perl -i -0pe 's/

.*<\/h1>/

{{ config.book.title }}<\/h1>/s' _layouts/website/header.html git mv _layouts/ src/ # fix style - not working - TODO cat >>styles/website.css <<'EOF' .book-summary ul.summary li a, .book-summary ul.summary li span { padding: 2px 4px; } .book-header h1 { opacity: 1; transition: none; -webkit-transition: none; -moz-transition: none; -o-transition: none; } EOF npx honkit serve #npm i -D http-server #npx honkit build . _r2book && npx http-server _r2book/ ```

[azu]

i have { root: './src' } in my book.json

Probably, you need to move styles into src/ dir. HonKit will refer styles/website.css based on root dir.

.
└── src/
    ├── _layouts/
    │   └── website/
    │       └── header.html
    └── styles/
        └── website.css

https://github.com/radareorg/radare2book/blob/master/book.toml original config(mdbook?) does not have root.

[milahu]

Probably, you need to move styles into src/ dir.

yes! now it works

tried the same thing yesterday and it failed, no idea whats different today : /

original config(mdbook?) does not have root.

without root=src, honkit finds only one page (README.md)

[azu]

Pages you want to show should be defined in SUMMARY.md. https://honkit.netlify.app/pages.html