Unable to minify Jekyll javascript via jekyll-assets or jekyll-minifier - jekyll

I'm having a heck of a time figuring out how to get Jekyll (v4.0.0) to minify javascript. I have installed jekyll-assets (v3.0.12) and jekyll-minifier (v0.1.10) in an effort to do so, but no luck so far... the javascript remains unminified.
I've tried a number of configuration options in _config.yml that didn't help, referencing the documentation here:
https://github.com/envygeeks/jekyll-assets/tree/v3.0-current#configuration
Any help would be greatly appreciated!
Gemfile
# frozen_string_literal: true
source "https://rubygems.org"
git_source(:github) {|repo_name| "https://github.com/#{repo_name}" }
# gem "rails"
gem "jekyll", "~> 4.0"
group :jekyll_plugins do
gem "jekyll-assets"
gem "jekyll-minifier"
end
_config.yml
permalink: pretty
sass:
style: compressed
exclude:
- gulpfile.js
- node_modules
- CNAME
- README
- '*.json'
- .DS_Store
plugins:
- jekyll-assets
- jekyll-minifier
assets:
sources:
- "css"
- "js"
_includes/scripts.html
...
{% javascript app %}
...
js/app.js
//=require scripts.js
//=require scripts-2.js
var myStr = "app";
myStr += " js";
console.log(myStr);
command line
JEKYLL_ENV=production bundle exec jekyll build

The Jekyll-Minifier plugin may be minifying javascript in the _site directory after Jekyll creates the static site. If you are using github pages, this won't work as Github is building from the source and has limited plugin support. You may have to build using the plugin and use the _site directory to serve manually, or find a different plugin that minimizes in place rather than in the _site directory.

Related

Kramdown backticks not recognized in GFM mode

I'm trying to get some very simple pages to render properly with Jekyll using kramdown to process markdown and rouge for syntax highlighting. Kramdown appears to not interpret triple-backticks, however, even in GFM mode.
I believe I've followed the instructions to the letter, and things work out fine when pushed to github pages, but my local setup just ignores the backticks.
If it's any help, this has been observed on OS X with Jekyll 3.1.1. The command line used to invoke jekyll is jekyll serve --config "_config.yml".
I've narrowed the problem to the following minimal test:
_config.yml
markdown: kramdown
highlighter: rouge
kramdown:
input: GFM
index.md
---
layout: default
---
```scala
def test(i: Int): Unit = {
println(i)
}
```
layout/default.html
<!doctype html>
<html>
<body>{{ content }}</body>
</html>
Resulting index.html
<!doctype html>
<html>
<body><p>```scala
def test(i: Int): Unit = {
println(i)
}</p>
<p>```</p>
</body>
</html>
I suggest you to do like this. I tested your code block whit the following configuration and it worked fine:
config.yml :
highlighter: rouge
markdown: kramdown
kramdown:
input: GFM
Then, to your file index.md:
```scala
def test(i: Int): Unit = {
println(i)
}
```
Note: I've noticed that there was a space before ```scala and it shouldn't be there.
Then, run jekyll serve with bundler:
Open your terminal and:
Install bundler:
gem install bundler
Update all your gems (if you want):
bundle update
Add a Gemfile (don't add any file extension) to your site root and paste the code below into it. This is GitHub Pages recommended method.
source 'https://rubygems.org'
gem 'github-pages'
Go to your project root folder (on the terminal) and run:
bundle install (this will make sure you have all required gems and their dependencies installed locally). A Gemfile.lock will be generated for you at your site root. Leave it there.
Run bundle exec jekyll serve --watch to view your site locally at http://localhost:4000
Done!
Let me know if this works for you, yeah?

Excluding a directory from Jekyll watch

I'm using Jekyll 3.1.1 to generate a blog and I recently introduced a Git hook to automatically publish changes pre-push.
After introducing this hook, I have started getting the following error when I run jekyll serve:
Configuration file: /Users/egillespie/Projects/blog.givingjar.org/_config.yml
Source: /Users/egillespie/Projects/blog.givingjar.org
Destination: /Users/egillespie/Projects/blog.givingjar.org/_site
Incremental build: disabled. Enable with --incremental
Generating...
done in 0.223 seconds.
** ERROR: directory is already being watched! **
Directory: /Users/egillespie/Projects/blog.givingjar.org/node_modules/git-scripts/bin/hooks
is already being watched through: /Users/egillespie/Projects/blog.givingjar.org/node_modules/git-scripts/bin/hooks
MORE INFO: https://github.com/guard/listen/wiki/Duplicate-directory-errors
Auto-regeneration: enabled for '/Users/egillespie/Projects/blog.givingjar.org'
Configuration file: /Users/egillespie/Projects/blog.givingjar.org/_config.yml
Server address: http://127.0.0.1:4000/
Server running... press ctrl-c to stop.
What's peculiar is that I am excluding node_modules in _config.yml:
exclude:
- Gemfile
- Gemfile.lock
- LICENSE
- README.md
- package.json
- Gruntfile.js
- node_modules
node_modules is correctly being excluded from building (i.e. there is no node_modules subdirectory in _site).
I'm also excluding node_modules in .gitignore:
# project
node_modules
_site*
.sass-cache
.jekyll-metadata
# general
.DS_Store
Thumbs.db
ehthumbs.db
Based on this GitHub issue and this commit it seems like node_modules should be excluded from the watch, but it's not. I can't decipher from the documentation if there's another way to exclude files from the watch.
What is the proper way for me to exclude a directory from the watch and avoid the error described above?
The value for exclude parameter in _config.yml should be an array i.e.
exclude: ['_site', 'node_modules', ...]
Source: Jekyll Documentation - Configuration
Judging by the paths displayed in your output, you're on macOS. The jekyll-watch gem is responsible for this area (watch/rebuild features), which itself depends on the 'listen' gem. The listen gem itself uses the rb-inotify gem as a dependency, which has several issues with macOS specifically and its filesystem. This results in several bugs in regeneration behaviour that aren't not easy to fix. Background and relevant bugs:
https://github.com/guard/listen/issues/274
https://github.com/guard/listen/pull/273
You can try using the 'polling' method: https://github.com/guard/listen#listen-adapters instead, but it's much slower.
Try this to your _config.yml:
keep_files: [node]
where node is a folder to exclude from the --watch. What this will do is keeping the folder node untouched by jekyll build. Then add all files that you want to keep in the site root but not rendered by Jekyll.

Run jekyll build Command with Different url Flag

My current _config.yml file looks like this:
#Site settings
...
baseurl: "" # the subpath of your site, e.g. /blog/
url: "http://10.0.1.9:3000" # the base hostname & protocol for your site
...
# Build settings
markdown: kramdown
safe: true
lsi: false
highlighter: true
keep_files: [public]
exclude: [src, lib, node_modules, bower.json, Gemfile, gulpfile.js, package.json, README.md]
I've got my url currently set to my local server, where I serve my Jekyll site for local development.
When building for production however, I have to keep manually changing this url to the url of my remote server before running jekyll build. Is there a way I can pass my remote url alongside the jekyll build command to build a site with the correct remote paths?
Something like so:
jekyll build --url mysite.com
Any help is appreciated with this. Thanks in advance!
Put your production url in _config.yml eg: url: toto.com.
Create a _config_dev.yml that will be used to override values in development.
In you case
url: "http://10.0.1.9:3000"
Development build is launched with :
jekyll build --config _config.yml,_config_dev.yml
Values in the last config file in the command will override those in first file.
and production build with jekyll build.
See Jekyll documentation http://jekyllrb.com/docs/configuration/#build-command-options configuration paragraphe.

Using susy with Jekyll

Is it possible to use Susy with Jekyll? If so, how?
I tried adding 'susy' to my Gemfile and bundle install'ing, then adding susy to my gems array in config.yml:
// _config.yml
...
gems:
- 'jekyll-compass'
- 'susy'
and following the instructions in Jekyll's docs, placing #import 'susy' in my /css/style.scss file. However, I get an error:
File to import not found or unreadable: susy.
jekyll-compass lets you configure Compass. There's more info in its readme, but for susy I just needed to add a _data/compass.yml file, and add
require:
- susy
to it.
Also, jekyll-compass expects your main entry style.scss to be under _sass, not css (like Jekyll's out of the box sass support does). I'm sure this is configurable as well.
If you're willing to install susy with bower, you can just symlink the files under bower_components/susy/sass to the _sass directory (ln -s bower_components/susy/sass/* _sass. I have a fairly minimal working example on GitHub.
The CSS is generated properly and served here for now (though that link will hopefully rapidly become out of sync with the git commit referenced above).

adding yeoman to github pages blog

I had a blog running at morenoh149.github.io I attempted to add yeoman to my workflow using jekyllrb generator. I followed the instructions by creating a new yeoman project, and copying over all the generated files and structure to my blog. But now github pages isn't picking up the blog. https://github.com/morenoh149/morenoh149.github.io
Anyone know how github pages works? the docs are sparse.
I changed the source in my yml file to app/ as well. So now when I run jekyll locally it works. But when I push to github pages it's not.
_config.yml
# Jekyll configuration precedence:
# 1. Gruntfile task
# 2. config.build.yml
# 3. config.yml
name: morenoh149.blog.yeoman
url: morenoh149.github.io
description: Harry Moreno has a blog
author:
name: Harry Moreno
email: morenoh149#gmail.com
# Grunt handles images and assets.
exclude: ['img', 'css', 'js', 'fonts',
'**.png', '**.jpg', '**.jpeg', '**.gif', '**.webp', '**.svg', '**.ico']
include: ['.htaccess']
source: app
# _config.build.yml sets future and show_drafts to false on `grunt build`
future: true
show_drafts: true
# Markdown library
markdown: redcarpet
# extensions: ['fenced_code_blocks', 'smart']
pygments: true
It looks like GitHub Pages is serving files from your site (for instance, http://morenoh149.github.io/app/ is an html file with a single paragraph element) but it's not serving them properly with all the Jekyll magic.
It turns out that GitHub Pages will override the source setting in the config file. This means that while you've specified source: app, it's looking at your top-level directory for content.
The solution is to move the contents of your app directory into your top-level directory.