search

mohkale / jekyll-tsc

compile typescript files on your jekyll blog
MIT License
9 stars 2 forks source link

How to use with Github pages site? #2

Closed ajaxify closed 3 years ago

ajaxify commented 3 years ago

Thank you for the gem. I would like to use this for a site hosted on Github pages. Things work fine locally, but when I push to Github, the live site gives me a 404 for the compiled js file.

I have been able to work around this by manually copying and committing the compiled js file in the correct assets location, but it would be great if this worked automatically. I assume I'm just missing something obvious, as I'm not the most familiar with TS/JS or Ruby.

Thanks!

mohkale commented 3 years ago

@ajaxify

Sorry to say this plugin is essentially deprecated. I stopped using jekyll and so this plugin is basically an artefact from back when I did. For now I'd ask you to double check the jekyll version on github-pages and compare the verbose build output on pages with your local systems output.

I'd also recommend switching to webpack or some other bundler because truth be told this plugin isn't the correct way to add typescript or other node packages to your blog. I initially did it this way cause I didn't want to have to learn the 50 differenet frameworks and build tools you need to get anything done with modern javascript. But honestly you can get quite a lot done with just copy-pasting configs.

I'd suggest:

  1. Add a package.json file to your repo and go through one of the walkthroughs online about getting setup.
  2. Make web-pack write the compiled output to somewhere inside your jekyll assets (eg: scripts) section.
  3. Install concurrently and use it to run both your webpack-dev-server and jekyll server together.

This is essentially the approach I adopted when I moved to hugo.

mohkale commented 3 years ago

@ajaxify

It's also worth mentioning that github-pages doesn't support all plugins.

GitHub Pages cannot build sites using unsupported plugins. If you want to use unsupported plugins, generate your site locally and then push your site's static files to GitHub.

I'm guessing that's why my plugin isn't working on your pages site. You could switch to gitlab-pages like I did which lets you use an arbitrary VM to build and deploy your site or you can try getting setup with github actions, build your site on there and deploy from there.

ajaxify commented 3 years ago

Thanks a ton for the info and taking the time to explain. I'll reply back when I've determined a workaround for me. Thanks for the initial suggestions.

I initially did it this way cause I didn't want to have to learn the 50 differenet frameworks and build tools you need to get anything done with modern javascript.

Tell me about it. I was also hoping to avoid this.

mohkale commented 3 years ago

Tell me about it. I was also hoping to avoid this.

I'd recommend just forgetting about anything sensible. Run npm install before going to bed and hopefully the 10,000 packages you need to get hello world working will be there when you wake up.

In all seriousness if you're going to be doing a lot of web-development you'll probably have to learn all that stuff anyways. It's an ordeal but it's one you'll have to get used to. Also an SSD will work wonders when having like a dozen node projects on the same disk all re-installing dependencies like web-pack or gulp etc. Good luck.

I'll be closing this issue now, if you find a fix feel free to comment it or re-open it.

ajaxify commented 3 years ago

Just in case anyone else comes across this, I was easily able to get this to work using Github Actions. Here's the action I used: https://github.com/limjh16/jekyll-action-ts#use-the-action

Only change I made was to specify Ruby 2.7 in the workflow yaml and to remove the Gemfile.lock from my gitignore in my repo. Was pretty painless, to be honest. Hope this help someone else.