How to build my new CSS file for Dawn theme

Developer help
1

Hi Guys, I am completely stuck trying to make very tiny changes to the dawn theme and need help.

I have installed gulp, yarn and node. I have then gone to the blog CSS file and made the tiniest change to one of the headings. However, when trying to compile the changes I am failing to make them work.

Here are the instructions I have been following: Dawn/README.md at main · TryGhost/Dawn · GitHub

I change directory to: cd content/themes/Dawn-master

Then I type yarn which runs successfully

However, when I run the next bit yarn dev I get the below errors.

yarn run v1.22.5
warning dawn@1.0.0: The engine "ghost" appears to be invalid.
warning dawn@1.0.0: The engine "ghost-api" appears to be invalid.
$ gulp
Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /Users/joemacguffog/my_ghost/content/themes/Dawn-master/node_modules/beeper/index.js
require() of ES modules is not supported.
require() of /Users/joemacguffog/my_ghost/content/themes/Dawn-master/node_modules/beeper/index.js from /Users/joemacguffog/my_ghost/content/themes/Dawn-master/gulpfile.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename index.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from /Users/joemacguffog/my_ghost/content/themes/Dawn-master/node_modules/beeper/package.json.

at Object.Module._extensions..js (internal/modules/cjs/loader.js:1080:13)
at Module.load (internal/modules/cjs/loader.js:928:32)
at Function.Module._load (internal/modules/cjs/loader.js:769:14)
at Module.require (internal/modules/cjs/loader.js:952:19)
at require (internal/modules/cjs/helpers.js:88:18)
at Object.<anonymous> (/Users/joemacguffog/my_ghost/content/themes/Dawn-master/gulpfile.js:10:16)
at Module._compile (internal/modules/cjs/loader.js:1063:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
at Module.load (internal/modules/cjs/loader.js:928:32)
at Function.Module._load (internal/modules/cjs/loader.js:769:14) {
  code: 'ERR_REQUIRE_ESM'
}
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

I have tried following the instructions in the error, but have been trying for hours and have still failed to make any progress. Please help? :)

Required info:

  • Latest version of ghost

  • Running locally hosted on a mac

  • Not sure how you would reproduce other than trying to change the CSS of the dawn theme yourself

2

Hey @JMacGuff :wave:, could you try again now with the latest copy of Dawn? This was fixed :slightly_smiling_face:

3

Hey @minimaluminium,

Thanks for the help!! I have now managed to make the change to the CSS I wanted to make :slight_smile:

I do seem to be getting a further error that I have pasted below when running yarn dev.

In response to the error I tried kill -9 PID with the appropriate id, but had no success.

Seeing as its working for me now, I am not worried about it but thought I’d share it

    yarn run v1.22.5
warning dawn@1.0.0: The engine "ghost" appears to be invalid.
warning dawn@1.0.0: The engine "ghost-api" appears to be invalid.
$ gulp
Debugger attached.
[10:15:33] Using gulpfile ~/my_ghost/content/themes/Dawn-master/gulpfile.js
[10:15:33] Starting 'default'...
[10:15:33] Starting 'css'...
[10:15:34] Finished 'css' after 1.03 s
[10:15:34] Starting 'js'...
[10:15:36] Finished 'js' after 2.33 s
[10:15:36] Starting 'serve'...
[10:15:36] Finished 'serve' after 3.9 ms

... Uhoh. Got error listen EADDRINUSE: address already in use :::35729 ...
Error: listen EADDRINUSE: address already in use :::35729
    at Server.setupListenHandle [as _listen2] (net.js:1318:16)
    at listenInCluster (net.js:1366:12)
    at Server.listen (net.js:1452:7)
    at Server.listen (/Users/joemacguffog/my_ghost/content/themes/Dawn-master/node_modules/tiny-lr/src/server.js:264:19)
    at Function.exports.listen (/Users/joemacguffog/my_ghost/content/themes/Dawn-master/node_modules/gulp-livereload/index.js:97:18)
    at serve (/Users/joemacguffog/my_ghost/content/themes/Dawn-master/gulpfile.js:19:16)
    at bound (domain.js:413:15)
    at runBound (domain.js:424:12)
    at asyncRunner (/Users/joemacguffog/my_ghost/content/themes/Dawn-master/node_modules/async-done/index.js:55:18)
    at processTicksAndRejections (internal/process/task_queues.js:75:11)

You already have a server listening on 35729
You should stop it and try again.

[10:15:36] Starting 'hbsWatcher'...
[10:15:36] Starting 'cssWatcher'...
[10:15:36] Starting 'jsWatcher'...