I'm trying exclude paths in Pug, that should not be among compiled files in dist folder, but nothig help!.
I renamed dir parts to _parts, parts/footer.pug to _parts/_footer.pug, but I still see compiled files in dist/_parts/ dir.
So, how can exclude some paths in Pug. (I use pug-cli as compiler)?
Yes it's possible with bash
And if you're on Windows, you can use git bash
You just need to prefix the ignored file with "_"
So, suppose your project directory looks like this:-
my-project/
index.html
pugjs
_head.pug
index.pug
you can do:-
pug -w "$(ls ./pugjs/!(_*))" -o ./
Now what does this line do?
basically, the "$(ls ./pugjs/!(*))" lists all files that don't have the prefix ""
they get passed as files paths argument to pug
Related
I know this question will get so many downvotes and will be marked as a duplicate.
The problem is I searched a lot about that question and never got a satisfying answer.
When working with sources in HTML and we want to get an image from the same folder of the HTML file we type the image name directly. If it's inside a folder which is in the same place as the HTML file is, we type the folder name then image, and so on....
If the image is in a folder which contains another folder in which the HTML file exists, so we want to get one step back. We type ../ which means go one step back then the image name.
When I started learning node and how to use modules, modules which were in the same folder as the node file is, must be imported using ./ which was explained as 'in the same folder', while when we import modules like 'fs' and 'events' they don't need a ./
Can someone explain why we don't use ./ in html files while they are used sometimes in node and sometimes no?!
I want to explain it because the node default import setting.
like 'fs' and 'events', these library was installed with node installed, and was included by default. And these will be stored in system directory. Just like <stdio.h> for c, fs from python. It's the default library for the corresponding language.
But sometimes you write you own libraries wanted to be import by other node file, you should import it by using relative path...Because if you don't write './', it will default search the system file directory where is stored 'fs', 'http' and so on, node will not find your libraries.
Before we start ./ and ../ notation is used to refer files relatively.
Why we sometimes don't use ./ in node?
All the modules we install in NodeJS are in the folder node modules. Whenever you require a module require('fs') or require('3rdparty'). Node exactly knows where to look for the module as it is installed as a folder in local node_modules or global node_modules. And then it loads the index.js and then so on..
When to use ./ in node?
./ is a way(Relative way) to refer files in the file system. If you have a script which is part of the file system and not as part of a node_module, then you use './' or '../' notation based on your file location
Why we don't use ./ in HTML files?
As said by #sami, you can use either ./ or not. It works in both ways. I am accustomed to ./ when I work. It's more of personal opinion.
Hope this helps.
I want to use html-minifier to minify my html files.
I have install it by npm install -g html-minifier
However, sudo html-minifier rb.html --removeComments did NOT remove the comments in rb.html.
Does anyone know how to use it?
Additionally, I just want to minify the size of the html files by keeping exactly the same layout, what are conventional parameters that we put to html-minifier?
You can target all html files in a specified directory with the following command:
html-minifier --input-dir dist --output-dir dist
With this example script I am compressing all html files in dist and outputting them to the same directory — essentially replacing the uncompressed html files with the compressed ones.
The command above actually doesn't do anything to the files because no options were defined. Some useful options are:
--collapse-whitespace: Collapse whitespace that contributes to text nodes in a document tree.
--remove-comments: Remove HTML comments
--minify-css: Minifies embedded and inline CSS (<style></style> and style="")
--minify-js: Minifies embedded and inline JS (<script></script> and e.g onload="")
Here's a command that you may end up with:
html-minifier --input-dir dist --output-dir dist --remove-comments --collapse-whitespace --minify-js --minify-css
To see the complete list of available options, run html-minifier -h.
I'm considering Jekyll for a site I'm putting together that will be a blog with lots of images (and other larg-ish media files). It's easy enough to to make a directory for images and then link to them as needed in the posts. But, as I understand it, when the site is generated, all the image data will be duplicated into the generated _site directory that holds the static files. Each time the site is generated the _site directory is emptied, and repopulated with the static version of the site.
Is there any way to, for example, drop a symlink to the images directory inside the site directory, and then maybe have jekyll ignore it when the static files are generated?
Or is there another way to go about this that makes more sense?
Assuming you are running on an apache web server, you can setup an Alias directive to serve images from a directory outside of the normal docroot. You need access to edit the VirtualHosts config or some other ability to create aliases directives (e.g. via a control panel).
For an example of how this would work, let's say you are storing your jekyll files under a directory called "/web/jekyll". To get your images directory do the following:
Add an "_images" directory along with your basic jekyll tree. Ending up with something like:
_config.yml
_images/
_layouts/
_posts/
_site/
index.md
Update your apache config to add the Alias directive like:
Alias /images /web/jekyll/_images
Reload the apache config and run jekyll to build the site.
Since the image directory name starts with an underscore, jekyll won't push/copy it to the output _site during the build. Apache will happily serve most files from your _site directory as normal, but when it sees something like "http://jekyll/images/test.jpg", instead of looking for the file under "/web/jekyll/_site/_images/test.jpg", it'll serve it from "/web/jekyll/_images/test.jpg".
Incidentally, I like a little more separation of the source content and output content than jekyll defaults to. So, I setup my directory structure as follows:
/web/jekyll/html/
/web/jekyll/images/
/web/jekyll/source/
/web/jekyll/source/_config.yml
/web/jekyll/source/_layouts
/web/jekyll/source/_posts
/web/jekyll/source/index.md
With the following option set in _config.yml
destination: ../html
And the apache alias directive setup with:
Alias /images /web/jekyll/images
Jekyll is run in the "/web/jekyll/source" directory, but output is sent to the "/web/jekyll/html" dir. Similar to the first example, calls to "http://jekyll/images/test.jpg" are served from "/web/jekyll/images/test.jpg". This setup doesn't really make a difference from a site serving perspective. I just like the cleaner separation between the raw source files, the fully baked output files and the images which work via the alias.
Correct, the first part of the jekyll command removes everything in the destination directory. The problem with that is the symlinks must be manually created again. So next, go ahead and create a script that does this each time.
Be sure that:
exclude: [jekyll, css, img] in the _config.yml file
linux: The ";" symbol runs first, second, third.. commands.
script: A file named jekyll with executable permissions containing
jekyll;
ln -s /var/www/css /var/www/_site/css;
ln -s /var/www/img /var/www/_site/img;
Finally run (./jekyll) that program instead of jekyll.
-Dan
Make a project page for the images.
Set up directory structure
/home/git/svnpenn.github.io
/home/git/img
Run Jekyll
# We cant add the symlink until after jekyll is done. We will remove the
# site folder and wait for it to rebuild.
rm -r _site
jekyll --server &
while [ ! -f _site/index.html ]
do
sleep 1
done
ln -s ../images _site/images
Note I was using this because I thought it would help publish time on GitHub
pages. It does not. GitHub can take 1-10 minutes to publish depending on the
server.
I know this has already been answered, but I went a slightly different route. I hosted all of my images in a public directory on Dropbox and use grunt to generate a manifest of the images. It keeps my repository small because the images don't get checked in. I detailed it a while back in a blog post.
How do I get Jekyll to work with Pow?
Thanks to the #mipadi answer, I learned that Pow automatically serves static files in the public directory of your application, so just configure Jekyll to change the directory where Jekyll will write files to from _site (the default) to public. Since public doesn't start with an underscore (_), you also have to add it to the list of files & directories to exclude. The relevant parts of my _config.yaml look like this:
destination: public
exclude: ["CNAME", "Rakefile", "README.md", "public"]
Then, just do the usual:
cd ~/.pow
ln -s /path/to/myjekyllsite
And navigate to http://myjekyllsite.dev/.
Pow public directory trailing slash issue: Going to http://myjekyllsite.dev/projects should automatically redirect to http://myjekyllsite.dev/projects/ but didn't.
Here's an approach that doesn't require overriding any of the normal Jekyll defaults:
Install rack-jekyll:
gem install rack-jekyll
Add config.ru with the following contents:
require "rack/jekyll"
run Rack::Jekyll.new
And now symlink your project directory into ~/.pow as you normally would.
I'm not familiar with Pow, but it looks like you could just symlink the output of your Jekyll-generated site into ~/.pow/public.
I am trying to use Jekyll together with Compass.
On one command line I'm running jekyll --auto and in another one compass watch.
The SASS files are located in /stylesheets and are compiled into /_site/stylesheets.
Jekyll is configured to ignore /stylesheets.
Compiling the stylesheets works fine in the beginning, but everytime I change something that makes Jekyll regenerate the site, it overwrites the whole /_site folder and /_site/stylesheets is gone. Compass doesn't regenerate it since the source SASS files haven't changed.
Is there another way to use Jekyll together with Compass?
Can I configure Jekyll to not overwrite the complete output folder but just the files that changed?
Im using Jekyll & Compass for my github page. here: https://github.com/ardianzzz/ardianzzz.github.com
Simple,
I just put the generated css folder in the root folder. Jekyll will generate the file inside _site folder.
As you can see in my repository.
Just call the CSS with the following code
<link href = "/css/screen.css" ...
bad english, sorry. :)
The issue is that Jekyll, when run, scraps all the contents of the _site directory. The way I got around this was to use rake for deployment, and then have the following in my rakefile:
task :generate => :clear do
sh 'jekyll'
sh 'compass compile'
end
I then just run:
$ rake generate
Which populates the jekyll directory, and then puts the compass files over.
A neater solution might be to make your compass -watch process (assuming that is what you are running) compile the compass to projectdir/css. When you then run jekyll it will just pull that css directory directly into _site/css and you're done, no problems (see below for dir structure).
projectdir/
css/
stylesheets/
If you put anything in _site/css and then run jekyll after it will be removed, so you either need to run compass after, or put the compass files into the css folder in the root directory, and then jekyll will just copy the files correctly.