├── .gitignore ├── .nojekyll ├── .nvmrc ├── .prettierrc ├── LICENCE ├── README.md ├── assets ├── .DS_Store ├── dependency_graph.png ├── github.png ├── gnu_logo.png ├── large_gnu_logo.png ├── pie.png ├── pie_ingredients.png └── twitter.png ├── build.js ├── docs ├── CNAME ├── Makefile ├── assets │ ├── dependency_graph.png │ ├── github.png │ ├── gnu_logo.png │ ├── large_gnu_logo.png │ ├── pie.png │ ├── pie_ingredients.png │ └── twitter.png ├── code.css ├── index.html ├── index.js ├── main.css └── screencasts.html ├── layouts └── layout.ejs ├── package.json ├── src ├── CNAME ├── Makefile ├── code.scss ├── index.js ├── index.md ├── main.scss └── screencasts.md └── yarn.lock /.gitignore: -------------------------------------------------------------------------------- 1 | _site 2 | -------------------------------------------------------------------------------- /.nojekyll: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /.nvmrc: -------------------------------------------------------------------------------- 1 | 12.22.12 2 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "singleQuote": true, 3 | "trailingComma": "all", 4 | "arrowParens": "always", 5 | "printWidth": 100 6 | } 7 | -------------------------------------------------------------------------------- /LICENCE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2025 Chase Lambert 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Makefile Tutorial by Example 2 | ======== 3 | 4 | This is a single page website. It's built by [metalsmith](https://metalsmith.io/), and the generated files are in `docs` (picked because Github Pages only supports `/` and `/docs` as directories to serve from). 5 | 6 | To run this locally: 7 | - `nvm use` # Pick node version 8 | - `yarn install` (If this fails to build node-sass, I've had luck with node v12.10.0) 9 | - `yarn dev` 10 | 11 | To deploy: 12 | - Make changes 13 | - `nvm use` # Pick node version 14 | - `yarn build` (or `yarn dev`) 15 | - Commit changes 16 | - git push 17 | -------------------------------------------------------------------------------- /assets/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/assets/.DS_Store -------------------------------------------------------------------------------- /assets/dependency_graph.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/assets/dependency_graph.png -------------------------------------------------------------------------------- /assets/github.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/assets/github.png -------------------------------------------------------------------------------- /assets/gnu_logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/assets/gnu_logo.png -------------------------------------------------------------------------------- /assets/large_gnu_logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/assets/large_gnu_logo.png -------------------------------------------------------------------------------- /assets/pie.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/assets/pie.png -------------------------------------------------------------------------------- /assets/pie_ingredients.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/assets/pie_ingredients.png -------------------------------------------------------------------------------- /assets/twitter.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/assets/twitter.png -------------------------------------------------------------------------------- /build.js: -------------------------------------------------------------------------------- 1 | var Metalsmith = require('metalsmith'), 2 | drafts = require('metalsmith-drafts'), 3 | layouts = require('metalsmith-layouts'), 4 | markdown = require('metalsmith-markdown'), 5 | assets = require('metalsmith-assets'), 6 | collections = require('metalsmith-collections'), 7 | autotoc = require('metalsmith-autotoc'), 8 | argv = require('minimist')(process.argv); 9 | var serve = require('metalsmith-serve'); 10 | var watch = require('metalsmith-watch'); 11 | var sass = require('metalsmith-sass'); 12 | const hljs = require('highlight.js'); 13 | const marked = require('marked'); 14 | 15 | var renderer = new marked.Renderer(); 16 | 17 | renderer.code = function (code, infostring, escaped) { 18 | /** Copied from the default implementation, with the following changes. 19 | * 1. Find a series of 4 spaces and convert it into tabs 20 | * 2. Add "hljs" to the code class. I don't get why, but metalsmith-metallic was doing this, so I copied the pattern. 21 | * 3. Remove this.options.langPrefix, because metalsmith-metallic didn't have this. 22 | */ 23 | code = code.replace(/ {4}/g, '\t'); // Convert spaces back into tabs 24 | var lang = (infostring || '').match(/\S*/)[0]; 25 | if (this.options.highlight) { 26 | var out = this.options.highlight(code, lang); 27 | if (out != null && out !== code) { 28 | escaped = true; 29 | code = out; 30 | } 31 | } 32 | 33 | if (!lang) { 34 | return '
' + (escaped ? code : escape(code, true)) + '
'; 35 | } 36 | 37 | return ( 38 | '
' +
 42 |     (escaped ? code : escape(code, true)) +
 43 |     '
\n' 44 | ); 45 | }; 46 | 47 | build(function () { 48 | console.log('Done building.'); 49 | }); 50 | 51 | function build(callback) { 52 | const smith = Metalsmith(__dirname) 53 | // This is the source directory 54 | .source('./src') 55 | 56 | // This is where I want to build my files to 57 | .destination('./docs') 58 | 59 | // Clean the build directory before running any plugins 60 | .clean(true) 61 | 62 | // Use the drafts plugin 63 | .use(drafts()) 64 | 65 | // Use Github Flavored Markdown for content 66 | .use( 67 | markdown({ 68 | gfm: true, 69 | tables: true, 70 | highlight: function (code, lang) { 71 | // TODO what if there is no lang? highlightAuto.. 72 | return hljs.highlight(lang, code).value; 73 | }, 74 | renderer, 75 | }), 76 | ) 77 | 78 | // Generate a table of contents JSON for every heading. 79 | .use( 80 | autotoc({ 81 | selector: 'h1, h2, h3, h4, h5, h6', 82 | headerIdPrefix: 'subhead', 83 | }), 84 | ) 85 | 86 | // Group my content into 4 distinct collections. These collection names 87 | // are defined as `collection: ` inside the markdown YAML. 88 | // .use( 89 | // collections({ 90 | // "Get Started": { sortBy: "date" }, 91 | // Tutorials: { sortBy: "date" }, 92 | // "User Authentication": { sortBy: "date" }, 93 | // "Building with React & Flux": { sortBy: "date" }, 94 | // }) 95 | // ) 96 | 97 | // Use handlebars as layout engine. 98 | //.use(layouts('handlebars')) 99 | .use(layouts({ engine: 'ejs' })) 100 | 101 | .use( 102 | sass({ 103 | outputStyle: 'expanded', 104 | }), 105 | ) 106 | 107 | // Use the assets plugin to specify where assets are stored 108 | .use( 109 | assets({ 110 | source: './assets', 111 | destination: './assets', 112 | }), 113 | ); 114 | 115 | if (argv.dev) { 116 | smith 117 | .use( 118 | serve({ 119 | port: 8001, 120 | verbose: true, 121 | }), 122 | ) 123 | .use( 124 | watch({ 125 | paths: { 126 | 'src/*.md': true, 127 | 'src/*': '**/**', 128 | 'layouts/*': '**/*', 129 | 'assets/*.css': '**/*', 130 | }, 131 | }), 132 | ); 133 | } 134 | 135 | smith.build(function (err) { 136 | var message = err ? err : 'Build complete'; 137 | console.log(message); 138 | callback(); 139 | }); 140 | } 141 | -------------------------------------------------------------------------------- /docs/CNAME: -------------------------------------------------------------------------------- 1 | makefiletutorial.com 2 | -------------------------------------------------------------------------------- /docs/Makefile: -------------------------------------------------------------------------------- 1 | blah: blah.o 2 | cc blah.o -o blah # Runs third 3 | 4 | blah.o: blah.c 5 | cc -c blah.c -o blah.o # Runs second 6 | 7 | blah.c: 8 | echo "int main() { return 0; }" > blah.c # Runs first -------------------------------------------------------------------------------- /docs/assets/dependency_graph.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/docs/assets/dependency_graph.png -------------------------------------------------------------------------------- /docs/assets/github.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/docs/assets/github.png -------------------------------------------------------------------------------- /docs/assets/gnu_logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/docs/assets/gnu_logo.png -------------------------------------------------------------------------------- /docs/assets/large_gnu_logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/docs/assets/large_gnu_logo.png -------------------------------------------------------------------------------- /docs/assets/pie.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/docs/assets/pie.png -------------------------------------------------------------------------------- /docs/assets/pie_ingredients.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/docs/assets/pie_ingredients.png -------------------------------------------------------------------------------- /docs/assets/twitter.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chaselambda/makefiletutorial/2afd1e7ad69383e7c81c465047753ab0520c8c3e/docs/assets/twitter.png -------------------------------------------------------------------------------- /docs/code.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Orginal Style from ethanschoonover.com/solarized (c) Jeremy Hull 4 | 5 | */ 6 | .hljs { 7 | display: block; 8 | overflow-x: auto; 9 | padding: 0.5em; 10 | background: #2b2007; 11 | color: #F2F1D3; 12 | } 13 | 14 | .hljs-comment, 15 | .hljs-quote { 16 | color: #CCCBB1; 17 | } 18 | 19 | /* Solarized Green */ 20 | .hljs-keyword, 21 | .hljs-selector-tag, 22 | .hljs-addition { 23 | color: #859900; 24 | } 25 | 26 | /* Solarized Cyan */ 27 | .hljs-number, 28 | .hljs-string, 29 | .hljs-meta .hljs-meta-string, 30 | .hljs-literal, 31 | .hljs-doctag, 32 | .hljs-regexp { 33 | color: #A6C6FF; 34 | } 35 | 36 | /* Solarized Blue */ 37 | .hljs-title, 38 | .hljs-section, 39 | .hljs-name, 40 | .hljs-selector-id, 41 | .hljs-selector-class { 42 | color: #b4f79f; 43 | } 44 | 45 | /* Solarized Yellow */ 46 | .hljs-attribute, 47 | .hljs-attr, 48 | .hljs-variable, 49 | .hljs-template-variable, 50 | .hljs-class .hljs-title, 51 | .hljs-type { 52 | color: #F2EA50; 53 | } 54 | 55 | /* Solarized Orange */ 56 | .hljs-symbol, 57 | .hljs-bullet, 58 | .hljs-subst, 59 | .hljs-meta, 60 | .hljs-meta .hljs-keyword, 61 | .hljs-selector-attr, 62 | .hljs-selector-pseudo, 63 | .hljs-link { 64 | color: #FFADF3; 65 | } 66 | 67 | /* Solarized Red */ 68 | .hljs-built_in, 69 | .hljs-deletion { 70 | color: #FFCA59; 71 | } 72 | 73 | .hljs-formula { 74 | background: #073642; 75 | } 76 | 77 | .hljs-emphasis { 78 | font-style: italic; 79 | } 80 | 81 | .hljs-strong { 82 | font-weight: bold; 83 | } 84 | -------------------------------------------------------------------------------- /docs/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | Makefile Tutorial By Example 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 55 |
56 |
57 | 69 |
70 | 71 | 72 | 73 |
    74 |
  1. 75 | Getting Started 76 | 77 |
  2. 78 | 79 | 80 | 81 |
      82 |
    1. 83 | Why do Makefiles exist? 84 | 85 |
    2. 86 | 87 |
    88 | 89 |
      90 |
    1. 91 | What alternatives are there to Make? 92 | 93 |
    2. 94 | 95 |
    96 | 97 |
      98 |
    1. 99 | The versions and types of Make 100 | 101 |
    2. 102 | 103 |
    104 | 105 |
      106 |
    1. 107 | Running the Examples 108 | 109 |
    2. 110 | 111 |
    112 | 113 |
      114 |
    1. 115 | Makefile Syntax 116 | 117 |
    2. 118 | 119 |
    120 | 121 |
      122 |
    1. 123 | The essence of Make 124 | 125 |
    2. 126 | 127 |
    128 | 129 |
      130 |
    1. 131 | More quick examples 132 | 133 |
    2. 134 | 135 |
    136 | 137 |
      138 |
    1. 139 | Make clean 140 | 141 |
    2. 142 | 143 |
    144 | 145 |
      146 |
    1. 147 | Variables 148 | 149 |
    2. 150 | 151 |
    152 | 153 | 154 | 155 |
156 | 157 |
    158 |
  1. 159 | Targets 160 | 161 |
  2. 162 | 163 | 164 | 165 |
      166 |
    1. 167 | The all target 168 | 169 |
    2. 170 | 171 |
    172 | 173 |
      174 |
    1. 175 | Multiple targets 176 | 177 |
    2. 178 | 179 |
    180 | 181 | 182 | 183 |
184 | 185 |
    186 |
  1. 187 | Automatic Variables and Wildcards 188 | 189 |
  2. 190 | 191 | 192 | 193 |
      194 |
    1. 195 | * Wildcard 196 | 197 |
    2. 198 | 199 |
    200 | 201 |
      202 |
    1. 203 | % Wildcard 204 | 205 |
    2. 206 | 207 |
    208 | 209 |
      210 |
    1. 211 | Automatic Variables 212 | 213 |
    2. 214 | 215 |
    216 | 217 | 218 | 219 |
220 | 221 |
    222 |
  1. 223 | Fancy Rules 224 | 225 |
  2. 226 | 227 | 228 | 229 |
      230 |
    1. 231 | Implicit Rules 232 | 233 |
    2. 234 | 235 |
    236 | 237 |
      238 |
    1. 239 | Static Pattern Rules 240 | 241 |
    2. 242 | 243 |
    244 | 245 |
      246 |
    1. 247 | Static Pattern Rules and Filter 248 | 249 |
    2. 250 | 251 |
    252 | 253 |
      254 |
    1. 255 | Pattern Rules 256 | 257 |
    2. 258 | 259 |
    260 | 261 |
      262 |
    1. 263 | Double-Colon Rules 264 | 265 |
    2. 266 | 267 |
    268 | 269 | 270 | 271 |
272 | 273 |
    274 |
  1. 275 | Commands and execution 276 | 277 |
  2. 278 | 279 | 280 | 281 |
      282 |
    1. 283 | Command Echoing/Silencing 284 | 285 |
    2. 286 | 287 |
    288 | 289 |
      290 |
    1. 291 | Command Execution 292 | 293 |
    2. 294 | 295 |
    296 | 297 |
      298 |
    1. 299 | Default Shell 300 | 301 |
    2. 302 | 303 |
    304 | 305 |
      306 |
    1. 307 | Double dollar sign 308 | 309 |
    2. 310 | 311 |
    312 | 313 |
      314 |
    1. 315 | Error handling with -k, -i, and - 316 | 317 |
    2. 318 | 319 |
    320 | 321 |
      322 |
    1. 323 | Interrupting or killing make 324 | 325 |
    2. 326 | 327 |
    328 | 329 |
      330 |
    1. 331 | Recursive use of make 332 | 333 |
    2. 334 | 335 |
    336 | 337 |
      338 |
    1. 339 | Export, environments, and recursive make 340 | 341 |
    2. 342 | 343 |
    344 | 345 |
      346 |
    1. 347 | Arguments to make 348 | 349 |
    2. 350 | 351 |
    352 | 353 | 354 | 355 |
356 | 357 |
    358 |
  1. 359 | Variables Pt. 2 360 | 361 |
  2. 362 | 363 | 364 | 365 |
      366 |
    1. 367 | Flavors and modification 368 | 369 |
    2. 370 | 371 |
    372 | 373 |
      374 |
    1. 375 | Command line arguments and override 376 | 377 |
    2. 378 | 379 |
    380 | 381 |
      382 |
    1. 383 | List of commands and define 384 | 385 |
    2. 386 | 387 |
    388 | 389 |
      390 |
    1. 391 | Target-specific variables 392 | 393 |
    2. 394 | 395 |
    396 | 397 |
      398 |
    1. 399 | Pattern-specific variables 400 | 401 |
    2. 402 | 403 |
    404 | 405 | 406 | 407 |
408 | 409 |
    410 |
  1. 411 | Conditional part of Makefiles 412 | 413 |
  2. 414 | 415 | 416 | 417 |
      418 |
    1. 419 | Conditional if/else 420 | 421 |
    2. 422 | 423 |
    424 | 425 |
      426 |
    1. 427 | Check if a variable is empty 428 | 429 |
    2. 430 | 431 |
    432 | 433 |
      434 |
    1. 435 | Check if a variable is defined 436 | 437 |
    2. 438 | 439 |
    440 | 441 |
      442 |
    1. 443 | $(MAKEFLAGS) 444 | 445 |
    2. 446 | 447 |
    448 | 449 | 450 | 451 |
452 | 453 |
    454 |
  1. 455 | Functions 456 | 457 |
  2. 458 | 459 | 460 | 461 |
      462 |
    1. 463 | First Functions 464 | 465 |
    2. 466 | 467 |
    468 | 469 |
      470 |
    1. 471 | String Substitution 472 | 473 |
    2. 474 | 475 |
    476 | 477 |
      478 |
    1. 479 | The foreach function 480 | 481 |
    2. 482 | 483 |
    484 | 485 |
      486 |
    1. 487 | The if function 488 | 489 |
    2. 490 | 491 |
    492 | 493 |
      494 |
    1. 495 | The call function 496 | 497 |
    2. 498 | 499 |
    500 | 501 |
      502 |
    1. 503 | The shell function 504 | 505 |
    2. 506 | 507 |
    508 | 509 |
      510 |
    1. 511 | The filter function 512 | 513 |
    2. 514 | 515 |
    516 | 517 | 518 | 519 |
520 | 521 |
    522 |
  1. 523 | Other Features 524 | 525 |
  2. 526 | 527 | 528 | 529 |
      530 |
    1. 531 | Include Makefiles 532 | 533 |
    2. 534 | 535 |
    536 | 537 |
      538 |
    1. 539 | The vpath Directive 540 | 541 |
    2. 542 | 543 |
    544 | 545 |
      546 |
    1. 547 | Multiline 548 | 549 |
    2. 550 | 551 |
    552 | 553 |
      554 |
    1. 555 | .phony 556 | 557 |
    2. 558 | 559 |
    560 | 561 |
      562 |
    1. 563 | .delete_on_error 564 | 565 |
    2. 566 | 567 |
    568 | 569 | 570 | 571 |
572 | 573 |
    574 |
  1. 575 | Makefile Cookbook 576 | 577 |
  2. 578 | 579 |
580 | 581 | 582 | 583 |
584 |
585 | 1484 |
1485 | 1486 | 1487 | 1488 | -------------------------------------------------------------------------------- /docs/index.js: -------------------------------------------------------------------------------- 1 | function get_header_order() { 2 | const headers = document.querySelectorAll(".content h1, .content h2"); 3 | const ret = {}; 4 | let count = 0; 5 | for (const el of headers) { 6 | ret[el.id] = count; 7 | count += 1; 8 | } 9 | return ret; 10 | } 11 | 12 | function get_lowest_header(header_order, in_view_headers) { 13 | let ret = ""; 14 | let min = 99999; 15 | for (header of in_view_headers) { 16 | if (header_order[header] < min) { 17 | min = header_order[header]; 18 | ret = header; 19 | } 20 | } 21 | return ret; 22 | } 23 | 24 | window.addEventListener("DOMContentLoaded", () => { 25 | // console.log("loaded"); 26 | const in_view = {}; 27 | const header_order = get_header_order(); 28 | let current_header_id = ""; 29 | 30 | const observer = new IntersectionObserver( 31 | (entries) => { 32 | entries.forEach((entry) => { 33 | const id = entry.target.getAttribute("id"); 34 | if (entry.intersectionRatio > 0) { 35 | in_view[id] = true; 36 | } else { 37 | delete in_view[id]; 38 | } 39 | const lowest_header_id = get_lowest_header( 40 | header_order, 41 | Object.keys(in_view) 42 | ); 43 | if (current_header_id != lowest_header_id) { 44 | const current_header = document.querySelector( 45 | `#left li a[href="#${current_header_id}"]` 46 | ); 47 | if (current_header) { 48 | current_header.parentElement.classList.remove("active"); 49 | } 50 | 51 | const new_header = document.querySelector( 52 | `#left li a[href="#${lowest_header_id}"]` 53 | ); 54 | if (new_header) { 55 | new_header.parentElement.classList.add("active"); 56 | } 57 | current_header_id = lowest_header_id; 58 | } 59 | }); 60 | }, 61 | { rootMargin: `0px 0px 0px 0px` } 62 | ); 63 | 64 | // Track all sections that have an `id` applied 65 | document.querySelectorAll(".content h1, .content h2").forEach((section) => { 66 | observer.observe(section); 67 | }); 68 | }); 69 | -------------------------------------------------------------------------------- /docs/main.css: -------------------------------------------------------------------------------- 1 | html { 2 | scroll-behavior: smooth; 3 | tab-size: 2; 4 | min-width: 320px; 5 | } 6 | 7 | #left { 8 | font-size: 14px; 9 | } 10 | 11 | #left ol { 12 | padding: 0; 13 | margin: 0; 14 | } 15 | 16 | #left ol > ol { 17 | margin-left: 16px; 18 | } 19 | 20 | #left li { 21 | margin-top: 8px; 22 | list-style: none; 23 | } 24 | 25 | #left .active a { 26 | color: #002b36; 27 | } 28 | 29 | pre { 30 | overflow: auto; 31 | } 32 | 33 | html { 34 | height: 100%; 35 | font-family: system-ui, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; 36 | line-height: 1.3; 37 | font-size: 16px; 38 | color: #586e75; 39 | } 40 | 41 | a { 42 | color: #839496; 43 | text-decoration: none; 44 | } 45 | 46 | a:hover { 47 | text-decoration: underline; 48 | } 49 | 50 | p { 51 | margin: 16px 0 0 0; 52 | } 53 | 54 | pre { 55 | margin: 8px 0 0 0; 56 | } 57 | 58 | h1 { 59 | margin: 32px 0 0 0; 60 | font-weight: 600; 61 | } 62 | 63 | h1, 64 | h2, 65 | h3, 66 | .intro-header { 67 | color: #002b36; 68 | } 69 | 70 | h2 { 71 | margin: 16px 0 0 0; 72 | font-weight: 400; 73 | } 74 | 75 | * { 76 | min-width: 0; 77 | /* Otherwise
 blocks take up more space then they should. Needed for flexbox. */
 78 |   box-sizing: border-box;
 79 | }
 80 | 
 81 | body {
 82 |   height: 100%;
 83 |   width: 100%;
 84 |   margin: 0px;
 85 |   /*removes default style*/
 86 |   box-sizing: border-box;
 87 |   position: relative;
 88 | }
 89 | 
 90 | #header {
 91 |   max-width: 1280px;
 92 |   position: relative;
 93 |   margin-left: auto;
 94 |   margin-right: auto;
 95 |   margin-top: 16px;
 96 | }
 97 | 
 98 | #header .header-inside {
 99 |   display: flex;
100 |   justify-content: center;
101 | }
102 | 
103 | @media (max-width: 480px) {
104 |   #header .header-inside {
105 |     display: block;
106 |   }
107 | }
108 | 
109 | #header .title-left {
110 |   display: flex;
111 |   flex-direction: column;
112 |   justify-content: center;
113 |   align-items: stetch;
114 | }
115 | 
116 | #header .title-pic {
117 |   width: 560px;
118 |   height: 257px;
119 |   margin-left: 8px;
120 | }
121 | 
122 | #header .title-wrapper {
123 |   display: flex;
124 |   justify-content: center;
125 |   color: black;
126 |   margin: 0 0;
127 | }
128 | 
129 | #header .title-wrapper .title {
130 |   font-size: 60px;
131 | }
132 | 
133 | @media (max-width: 480px) {
134 |   #header .title-wrapper .title {
135 |     font-size: 45px;
136 |   }
137 | }
138 | 
139 | #header .title-wrapper .subtitle {
140 |   font-size: 30px;
141 | }
142 | 
143 | @media (max-width: 480px) {
144 |   #header .title-wrapper .subtitle {
145 |     font-size: 20px;
146 |     margin-bottom: 16px;
147 |   }
148 | }
149 | 
150 | #header .social-buttons {
151 |   display: flex;
152 |   justify-content: center;
153 | }
154 | 
155 | #header .intro-buttons {
156 |   display: flex;
157 |   justify-content: space-between;
158 |   flex-flow: row wrap;
159 |   text-align: center;
160 | }
161 | 
162 | @media (max-width: 480px) {
163 |   #header .intro-buttons {
164 |     flex-direction: column;
165 |     margin-bottom: 8px;
166 |   }
167 | }
168 | 
169 | #header .intro-buttons a:first-child {
170 |   margin-right: 16px;
171 | }
172 | 
173 | #header .intro-buttons a {
174 |   display: inline-block;
175 |   background-color: #2aa198;
176 |   color: white;
177 |   font-size: 18px;
178 |   padding: 16px 32px;
179 |   border: 0px;
180 |   border-radius: 8px;
181 |   cursor: pointer;
182 |   margin: 20px 0px;
183 | }
184 | 
185 | @media (max-width: 480px) {
186 |   #header .intro-buttons a {
187 |     margin: 0 16px 8px 16px;
188 |   }
189 | }
190 | 
191 | #header .intro-buttons a:hover {
192 |   background-color: #27968d;
193 |   text-decoration: none;
194 | }
195 | 
196 | .body-wrapper {
197 |   max-width: 1280px;
198 |   position: relative;
199 |   margin-left: auto;
200 |   margin-right: auto;
201 |   padding: 0 16px 0 16px;
202 | }
203 | 
204 | .social-buttons img {
205 |   width: 25px;
206 |   height: 25px;
207 |   margin-right: 10px;
208 | }
209 | 
210 | #left {
211 |   top: 0;
212 |   position: sticky;
213 |   width: 300px;
214 |   float: left;
215 |   height: 100vh;
216 |   display: flex;
217 |   flex-direction: column;
218 | }
219 | 
220 | #left .sidebar-header {
221 |   border-bottom: 1px solid #eee;
222 |   box-shadow: -20px 0px 20px 0px white;
223 |   z-index: 2;
224 | }
225 | 
226 | #left .sidebar-header .social-buttons {
227 |   display: flex;
228 |   justify-content: left;
229 | }
230 | 
231 | #left .sidebar-header .sidebar-title a {
232 |   display: flex;
233 |   justify-content: left;
234 |   font-size: 32px;
235 |   color: black;
236 | }
237 | 
238 | #left .sidebar-header .sidebar-title a:hover {
239 |   text-decoration: none;
240 | }
241 | 
242 | #left .sidebar-header .github-stars {
243 |   margin-top: 3px;
244 | }
245 | 
246 | #left .toc {
247 |   overflow-y: hidden;
248 |   padding-bottom: 16px;
249 | }
250 | 
251 | #left .toc:hover {
252 |   overflow-y: auto;
253 | }
254 | 
255 | #right {
256 |   margin-left: calc(32px + 300px);
257 | }
258 | 
259 | #right a {
260 |   color: #2aa198;
261 | }
262 | 
263 | .content {
264 |   padding-bottom: 36px;
265 | }
266 | 
267 | .content ul {
268 |   margin: 8px 0 0 32px;
269 |   padding: 0;
270 |   list-style: none;
271 | }
272 | 
273 | .content ul li {
274 |   line-height: 16px;
275 |   margin-top: 8px;
276 | }
277 | 
278 | .content ul li::before {
279 |   content: '\2022';
280 |   /* Add content: \2022 is the CSS Code/unicode for a bullet */
281 |   color: #c1c9d2;
282 |   /* Change the color */
283 |   font-weight: bold;
284 |   /* If you want it to be bold */
285 |   display: inline-block;
286 |   /* Needed to add space between the bullet and the text */
287 |   width: 24px;
288 |   /* Also needed for space (tweak if needed) */
289 |   margin-left: -24px;
290 |   /* Also needed for space (tweak if needed) */
291 | }
292 | 
293 | .yt-video {
294 |   display: flex;
295 |   justify-content: center;
296 |   margin-top: 16px;
297 | }
298 | 
299 | code {
300 |   color: #002b36;
301 |   border-radius: 4px;
302 |   background-color: #eef1f1;
303 |   font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;
304 |   padding: 0px 8px;
305 |   font-size: 14px;
306 | }
307 | 
308 | pre code {
309 |   border-radius: 8px;
310 |   font-size: 16px;
311 |   padding: 0px;
312 | }
313 | 
314 | @media (max-width: 480px) {
315 |   pre code {
316 |     font-size: 12px;
317 |   }
318 | }
319 | 
320 | .center {
321 |   display: flex;
322 |   justify-content: center;
323 | }
324 | 
325 | #header .social-buttons {
326 |   display: none;
327 | }
328 | 
329 | @media (max-width: 1020px) {
330 |   .title-pic {
331 |     display: none;
332 |   }
333 |   #left {
334 |     display: none;
335 |   }
336 |   #right {
337 |     margin-left: 0px;
338 |   }
339 |   #header .social-buttons {
340 |     display: flex;
341 |   }
342 | }
343 | 


--------------------------------------------------------------------------------
/docs/screencasts.html:
--------------------------------------------------------------------------------
 1 | 
 2 | 
 3 | 
 4 | 
 5 |     
 6 |     
 7 |     
 8 |     
 9 |     
10 |     
11 |     
12 |     Makefile Tutorial
13 |     
14 |     
15 | 
16 |     
17 |     
18 |     
19 |     
20 |     
21 |     
22 | 
23 | 
24 | 
25 | 
26 |                 
27 | 
28 |                     
55 |                     
56 |
57 | 69 |
70 | 71 | 72 | 73 |
    74 |
  1. 75 | Getting started video 76 | 77 |
  2. 78 | 79 |
80 | 81 | 82 | 83 |
84 |
85 | 92 |
93 | 94 | 95 | 96 | -------------------------------------------------------------------------------- /layouts/layout.ejs: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | <%- title %> 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | <% function renderToc(items) { %> 25 | <% for (item of items) { %> 26 |
    27 |
  1. 28 | <%= item.text %> 29 | 30 |
  2. 31 | <% if (item.children.length> 0) { %> 32 | <%- renderToc(item.children) %> 33 | <% } %> 34 |
35 | <% } %> 36 | <% } %> 37 | 38 | 39 | 40 | 67 |
68 |
69 | 81 |
82 | <% if (toc) { %> 83 | <%- renderToc(toc) %> 84 | <% } %> 85 |
86 |
87 | 92 |
93 | 94 | 95 | 96 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "makefile-tutorial", 3 | "version": "1.0.0", 4 | "description": "Makefile Tutorial with Examples", 5 | "scripts": { 6 | "dev": "node build.js --dev", 7 | "build": "node build.js" 8 | }, 9 | "dependencies": {}, 10 | "devDependencies": { 11 | "ejs": "^3.1.5", 12 | "handlebars": "^4.7.6", 13 | "metalsmith": "^2.3.0", 14 | "metalsmith-sass": "^1.7.0", 15 | "metalsmith-serve": "0.0.7", 16 | "metalsmith-stylus": "^3.0.0", 17 | "metalsmith-assets": "^0.1.0", 18 | "metalsmith-autotoc": "^0.1.3", 19 | "metalsmith-collections": "^0.9.0", 20 | "metalsmith-drafts": "^0.0.1", 21 | "metalsmith-layouts": "^1.6.5", 22 | "metalsmith-markdown": "1.3.0", 23 | "metalsmith-metallic": "^2.0.1", 24 | "metalsmith-watch": "^1.0.3", 25 | "minimist": "^1.2.0" 26 | }, 27 | "engines": { 28 | "node": ">=12.10.0", 29 | "yarn": "^1.21.0" 30 | }, 31 | "repository": { 32 | "type": "git", 33 | "url": "git+https://github.com/theicfire/makefiletutorial" 34 | }, 35 | "author": "Chase Lambert", 36 | "license": "MIT" 37 | } 38 | -------------------------------------------------------------------------------- /src/CNAME: -------------------------------------------------------------------------------- 1 | makefiletutorial.com 2 | -------------------------------------------------------------------------------- /src/Makefile: -------------------------------------------------------------------------------- 1 | blah: blah.o 2 | cc blah.o -o blah # Runs third 3 | 4 | blah.o: blah.c 5 | cc -c blah.c -o blah.o # Runs second 6 | 7 | blah.c: 8 | echo "int main() { return 0; }" > blah.c # Runs first -------------------------------------------------------------------------------- /src/code.scss: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Orginal Style from ethanschoonover.com/solarized (c) Jeremy Hull 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #2b2007; 12 | color: #F2F1D3; 13 | } 14 | 15 | .hljs-comment, 16 | .hljs-quote { 17 | color: #CCCBB1; 18 | } 19 | 20 | /* Solarized Green */ 21 | .hljs-keyword, 22 | .hljs-selector-tag, 23 | .hljs-addition { 24 | color: #859900; 25 | } 26 | 27 | /* Solarized Cyan */ 28 | .hljs-number, 29 | .hljs-string, 30 | .hljs-meta .hljs-meta-string, 31 | .hljs-literal, 32 | .hljs-doctag, 33 | .hljs-regexp { 34 | color: #A6C6FF; 35 | } 36 | 37 | /* Solarized Blue */ 38 | .hljs-title, 39 | .hljs-section, 40 | .hljs-name, 41 | .hljs-selector-id, 42 | .hljs-selector-class { 43 | color: #b4f79f; 44 | } 45 | 46 | /* Solarized Yellow */ 47 | .hljs-attribute, 48 | .hljs-attr, 49 | .hljs-variable, 50 | .hljs-template-variable, 51 | .hljs-class .hljs-title, 52 | .hljs-type { 53 | color: #F2EA50; 54 | } 55 | 56 | /* Solarized Orange */ 57 | .hljs-symbol, 58 | .hljs-bullet, 59 | .hljs-subst, 60 | .hljs-meta, 61 | .hljs-meta .hljs-keyword, 62 | .hljs-selector-attr, 63 | .hljs-selector-pseudo, 64 | .hljs-link { 65 | color: #FFADF3; 66 | } 67 | 68 | /* Solarized Red */ 69 | .hljs-built_in, 70 | .hljs-deletion { 71 | color: #FFCA59; 72 | } 73 | 74 | .hljs-formula { 75 | background: #073642; 76 | } 77 | 78 | .hljs-emphasis { 79 | font-style: italic; 80 | } 81 | 82 | .hljs-strong { 83 | font-weight: bold; 84 | } -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | function get_header_order() { 2 | const headers = document.querySelectorAll(".content h1, .content h2"); 3 | const ret = {}; 4 | let count = 0; 5 | for (const el of headers) { 6 | ret[el.id] = count; 7 | count += 1; 8 | } 9 | return ret; 10 | } 11 | 12 | function get_lowest_header(header_order, in_view_headers) { 13 | let ret = ""; 14 | let min = 99999; 15 | for (header of in_view_headers) { 16 | if (header_order[header] < min) { 17 | min = header_order[header]; 18 | ret = header; 19 | } 20 | } 21 | return ret; 22 | } 23 | 24 | window.addEventListener("DOMContentLoaded", () => { 25 | // console.log("loaded"); 26 | const in_view = {}; 27 | const header_order = get_header_order(); 28 | let current_header_id = ""; 29 | 30 | const observer = new IntersectionObserver( 31 | (entries) => { 32 | entries.forEach((entry) => { 33 | const id = entry.target.getAttribute("id"); 34 | if (entry.intersectionRatio > 0) { 35 | in_view[id] = true; 36 | } else { 37 | delete in_view[id]; 38 | } 39 | const lowest_header_id = get_lowest_header( 40 | header_order, 41 | Object.keys(in_view) 42 | ); 43 | if (current_header_id != lowest_header_id) { 44 | const current_header = document.querySelector( 45 | `#left li a[href="#${current_header_id}"]` 46 | ); 47 | if (current_header) { 48 | current_header.parentElement.classList.remove("active"); 49 | } 50 | 51 | const new_header = document.querySelector( 52 | `#left li a[href="#${lowest_header_id}"]` 53 | ); 54 | if (new_header) { 55 | new_header.parentElement.classList.add("active"); 56 | } 57 | current_header_id = lowest_header_id; 58 | } 59 | }); 60 | }, 61 | { rootMargin: `0px 0px 0px 0px` } 62 | ); 63 | 64 | // Track all sections that have an `id` applied 65 | document.querySelectorAll(".content h1, .content h2").forEach((section) => { 66 | observer.observe(section); 67 | }); 68 | }); 69 | -------------------------------------------------------------------------------- /src/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Makefile Tutorial By Example 3 | draft: false 4 | collection: Get Started 5 | layout: layout.ejs 6 | date: 2016-12-24 7 | autotoc: true 8 | --- 9 | 10 | I built this guide because I could never quite wrap my head around Makefiles. They seemed awash with hidden rules and esoteric symbols, and asking simple questions didn’t yield simple answers. To solve this, I sat down for several weekends and read everything I could about Makefiles. I've condensed the most critical knowledge into this guide. Each topic has a brief description and a self contained example that you can run yourself. 11 | 12 | If you mostly understand Make, consider checking out the [Makefile Cookbook](#makefile-cookbook), which has a template for medium sized projects with ample comments about what each part of the Makefile is doing. 13 | 14 | Good luck, and I hope you are able to slay the confusing world of Makefiles! 15 | 16 | # Getting Started 17 | 18 | ## Why do Makefiles exist? 19 | 20 | Makefiles are used to help decide which parts of a large program need to be recompiled. In the vast majority of cases, C or C++ files are compiled. Other languages typically have their own tools that serve a similar purpose as Make. Make can also be used beyond compilation too, when you need a series of instructions to run depending on what files have changed. This tutorial will focus on the C/C++ compilation use case. 21 | 22 | Here's an example dependency graph that you might build with Make. If any file's dependencies changes, then the file will get recompiled: 23 |
24 | 25 |
26 | 27 | ## What alternatives are there to Make? 28 | Popular C/C++ alternative build systems are [SCons](https://scons.org/), [CMake](https://cmake.org/), [Bazel](https://bazel.build/), and [Ninja](https://ninja-build.org/). Some code editors like [Microsoft Visual Studio](https://visualstudio.microsoft.com/) have their own built in build tools. For Java, there's [Ant](https://ant.apache.org/), [Maven](https://maven.apache.org/what-is-maven.html), and [Gradle](https://gradle.org/). Other languages like Go, Rust, and TypeScript have their own build tools. 29 | 30 | Interpreted languages like Python, Ruby, and raw Javascript don't require an analogue to Makefiles. The goal of Makefiles is to compile whatever files need to be compiled, based on what files have changed. But when files in interpreted languages change, nothing needs to get recompiled. When the program runs, the most recent version of the file is used. 31 | 32 | ## The versions and types of Make 33 | There are a variety of implementations of Make, but most of this guide will work on whatever version you're using. However, it's specifically written for GNU Make, which is the standard implementation on Linux and MacOS. All the examples work for Make versions 3 and 4, which are nearly equivalent other than some esoteric differences. 34 | 35 | ## Running the Examples 36 | 37 | To run these examples, you'll need a terminal and "make" installed. For each example, put the contents in a file called `Makefile`, and in that directory run the command `make`. Let's start with the simplest of Makefiles: 38 | ```makefile 39 | hello: 40 | echo "Hello, World" 41 | ``` 42 | 43 | > Note: Makefiles **must** be indented using TABs and not spaces or `make` will fail. 44 | 45 | Here is the output of running the above example: 46 | ```shell 47 | $ make 48 | echo "Hello, World" 49 | Hello, World 50 | ``` 51 | 52 | That's it! If you're a bit confused, here's a video that goes through these steps, along with describing the basic structure of Makefiles. 53 | 54 |
55 | 56 |
57 | 58 | ## Makefile Syntax 59 | 60 | A Makefile consists of a set of *rules*. A rule generally looks like this: 61 | ```makefile 62 | targets: prerequisites 63 | command 64 | command 65 | command 66 | ``` 67 | 68 | - The *targets* are file names, separated by spaces. Typically, there is only one per rule. 69 | - The *commands* are a series of steps typically used to make the target(s). These *need to start with a tab character*, not spaces. 70 | - The *prerequisites* are also file names, separated by spaces. These files need to exist before the commands for the target are run. These are also called *dependencies* 71 | 72 | ## The essence of Make 73 | 74 | Let's start with a hello world example: 75 | 76 | ```makefile 77 | hello: 78 | echo "Hello, World" 79 | echo "This line will print if the file hello does not exist." 80 | ``` 81 | There's already a lot to take in here. Let's break it down: 82 | - We have one *target* called `hello` 83 | - This target has two *commands* 84 | - This target has no *prerequisites* 85 | 86 | We'll then run `make hello`. As long as the `hello` file does not exist, the commands will run. If `hello` does exist, no commands will run. 87 | 88 | It's important to realize that I'm talking about `hello` as both a *target* and a *file*. That's because the two are directly tied together. Typically, when a target is run (aka when the commands of a target are run), the commands will create a file with the same name as the target. In this case, the `hello` *target* does not create the `hello` *file*. 89 | 90 | Let's create a more typical Makefile - one that compiles a single C file. But before we do, make a file called `blah.c` that has the following contents: 91 | ```c 92 | // blah.c 93 | int main() { return 0; } 94 | ``` 95 | 96 | Then create the Makefile (called `Makefile`, as always): 97 | ```makefile 98 | blah: 99 | cc blah.c -o blah 100 | ``` 101 | This time, try simply running `make`. Since there's no target supplied as an argument to the `make` command, the first target is run. In this case, there's only one target (`blah`). The first time you run this, `blah` will be created. The second time, you'll see `make: 'blah' is up to date`. That's because the `blah` file already exists. But there's a problem: if we modify `blah.c` and then run `make`, nothing gets recompiled. 102 | 103 | We solve this by adding a prerequisite: 104 | ```makefile 105 | blah: blah.c 106 | cc blah.c -o blah 107 | ``` 108 | 109 | When we run `make` again, the following set of steps happens: 110 | - The first target is selected, because the first target is the default target 111 | - This has a prerequisite of `blah.c` 112 | - Make decides if it should run the `blah` target. It will only run if `blah` doesn't exist, or `blah.c` is *newer than* `blah` 113 | 114 | This last step is critical, and is the **essence of make**. What it's attempting to do is decide if the prerequisites of `blah` have changed since `blah` was last compiled. That is, if `blah.c` is modified, running `make` should recompile the file. And conversely, if `blah.c` has not changed, then it should not be recompiled. 115 | 116 | To make this happen, it uses the filesystem timestamps as a proxy to determine if something has changed. This is a reasonable heuristic, because file timestamps typically will only change if the files are 117 | modified. But it's important to realize that this isn't always the case. You could, for example, modify a file, and then change the modified timestamp of that file to something old. If you did, Make would incorrectly guess that the file hadn't changed and thus could be ignored. 118 | 119 | Whew, what a mouthful. **Make sure that you understand this. It's the crux of Makefiles, and might take you a few minutes to properly understand**. Play around with the above examples or watch the video above if things are still confusing. 120 | 121 | ## More quick examples 122 | The following Makefile ultimately runs all three targets. When you run `make` in the terminal, it will build a program called `blah` in a series of steps: 123 | - Make selects the target `blah`, because the first target is the default target 124 | - `blah` requires `blah.o`, so make searches for the `blah.o` target 125 | - `blah.o` requires `blah.c`, so make searches for the `blah.c` target 126 | - `blah.c` has no dependencies, so the `echo` command is run 127 | - The `cc -c` command is then run, because all of the `blah.o` dependencies are finished 128 | - The top `cc` command is run, because all the `blah` dependencies are finished 129 | - That's it: `blah` is a compiled c program 130 | 131 | ```makefile 132 | blah: blah.o 133 | cc blah.o -o blah # Runs third 134 | 135 | blah.o: blah.c 136 | cc -c blah.c -o blah.o # Runs second 137 | 138 | # Typically blah.c would already exist, but I want to limit any additional required files 139 | blah.c: 140 | echo "int main() { return 0; }" > blah.c # Runs first 141 | ``` 142 | 143 | If you delete `blah.c`, all three targets will be rerun. If you edit it (and thus change the timestamp to newer than `blah.o`), the first two targets will run. If you run `touch blah.o` (and thus change the timestamp to newer than `blah`), then only the first target will run. If you change nothing, none of the targets will run. Try it out! 144 | 145 | This next example doesn't do anything new, but is nontheless a good additional example. It will always run both targets, because `some_file` depends on `other_file`, which is never created. 146 | ```makefile 147 | some_file: other_file 148 | echo "This will always run, and runs second" 149 | touch some_file 150 | 151 | other_file: 152 | echo "This will always run, and runs first" 153 | ``` 154 | 155 | ## Make clean 156 | `clean` is often used as a target that removes the output of other targets, but it is not a special word in Make. You can run `make` and `make clean` on this to create and delete `some_file`. 157 | 158 | Note that `clean` is doing two new things here: 159 | - It's a target that is not first (the default), and not a prerequisite. That means it'll never run unless you explicitly call `make clean` 160 | - It's not intended to be a filename. If you happen to have a file named `clean`, this target won't run, which is not what we want. See `.PHONY` later in this tutorial on how to fix this 161 | 162 | ```makefile 163 | some_file: 164 | touch some_file 165 | 166 | clean: 167 | rm -f some_file 168 | ``` 169 | 170 | 171 | ## Variables 172 | Variables can only be strings. You'll typically want to use `:=`, but `=` also works. See [Variables Pt 2](#variables-pt-2). 173 | 174 | Here's an example of using variables: 175 | ```makefile 176 | files := file1 file2 177 | some_file: $(files) 178 | echo "Look at this variable: " $(files) 179 | touch some_file 180 | 181 | file1: 182 | touch file1 183 | file2: 184 | touch file2 185 | 186 | clean: 187 | rm -f file1 file2 some_file 188 | ``` 189 | 190 | Single or double quotes have no meaning to Make. They are simply characters that are assigned to the variable. Quotes *are* useful to shell/bash, though, and you need them in commands like `printf`. In this example, the two commands behave the same: 191 | ```makefile 192 | a := one two# a is set to the string "one two" 193 | b := 'one two' # Not recommended. b is set to the string "'one two'" 194 | all: 195 | printf '$a' 196 | printf $b 197 | ``` 198 | 199 | Reference variables using either `${}` or `$()` 200 | ```makefile 201 | x := dude 202 | 203 | all: 204 | echo $(x) 205 | echo ${x} 206 | 207 | # Bad practice, but works 208 | echo $x 209 | ``` 210 | 211 | # Targets 212 | ## The all target 213 | 214 | Making multiple targets and you want all of them to run? Make an `all` target. 215 | Since this is the first rule listed, it will run by default if `make` is called without specifying a target. 216 | ```makefile 217 | all: one two three 218 | 219 | one: 220 | touch one 221 | two: 222 | touch two 223 | three: 224 | touch three 225 | 226 | clean: 227 | rm -f one two three 228 | 229 | ``` 230 | 231 | ## Multiple targets 232 | 233 | When there are multiple targets for a rule, the commands will be run for each target. `$@` is an [automatic variable](#automatic-variables) that contains the target name. 234 | ```makefile 235 | all: f1.o f2.o 236 | 237 | f1.o f2.o: 238 | echo $@ 239 | # Equivalent to: 240 | # f1.o: 241 | # echo f1.o 242 | # f2.o: 243 | # echo f2.o 244 | 245 | ``` 246 | 247 | # Automatic Variables and Wildcards 248 | ## * Wildcard 249 | 250 | Both `*` and `%` are called wildcards in Make, but they mean entirely different things. `*` searches your filesystem for matching filenames. I suggest that you always wrap it in the `wildcard` function, because otherwise you may fall into a common pitfall described below. 251 | 252 | ```makefile 253 | # Print out file information about every .c file 254 | print: $(wildcard *.c) 255 | ls -la $? 256 | ``` 257 | 258 | `*` may be used in the target, prerequisites, or in the `wildcard` function. 259 | 260 | Danger: `*` may not be directly used in a variable definitions 261 | 262 | Danger: When `*` matches no files, it is left as it is (unless run in the `wildcard` function) 263 | 264 | ```makefile 265 | thing_wrong := *.o # Don't do this! '*' will not get expanded 266 | thing_right := $(wildcard *.o) 267 | 268 | all: one two three four 269 | 270 | # Fails, because $(thing_wrong) is the string "*.o" 271 | one: $(thing_wrong) 272 | 273 | # Stays as *.o if there are no files that match this pattern :( 274 | two: *.o 275 | 276 | # Works as you would expect! In this case, it does nothing. 277 | three: $(thing_right) 278 | 279 | # Same as rule three 280 | four: $(wildcard *.o) 281 | ``` 282 | 283 | 284 | ## % Wildcard 285 | `%` is really useful, but is somewhat confusing because of the variety of situations it can be used in. 286 | - When used in "matching" mode, it matches one or more characters in a string. This match is called the stem. 287 | - When used in "replacing" mode, it takes the stem that was matched and replaces that in a string. 288 | - `%` is most often used in rule definitions and in some specific functions. 289 | 290 | See these sections on examples of it being used: 291 | - [Static Pattern Rules](#static-pattern-rules) 292 | - [Pattern Rules](#pattern-rules) 293 | - [String Substitution](#string-substitution) 294 | - [The vpath Directive](#the-vpath-directive) 295 | 296 | 297 | ## Automatic Variables 298 | 299 | There are many [automatic variables](https://www.gnu.org/software/make/manual/html_node/Automatic-Variables.html), but often only a few show up: 300 | ```makefile 301 | hey: one two 302 | # Outputs "hey", since this is the target name 303 | echo $@ 304 | 305 | # Outputs all prerequisites newer than the target 306 | echo $? 307 | 308 | # Outputs all prerequisites 309 | echo $^ 310 | 311 | # Outputs the first prerequisite 312 | echo $< 313 | 314 | touch hey 315 | 316 | one: 317 | touch one 318 | 319 | two: 320 | touch two 321 | 322 | clean: 323 | rm -f hey one two 324 | 325 | ``` 326 | 327 | # Fancy Rules 328 | ## Implicit Rules 329 | 330 | Make loves c compilation. And every time it expresses its love, things get confusing. Perhaps the most confusing part of Make is the magic/automatic rules that are made. Make calls these "implicit" rules. I don't personally agree with this design decision, and I don't recommend using them, but they're often used and are thus useful to know. Here's a list of implicit rules: 331 | - Compiling a C program: `n.o` is made automatically from `n.c` with a command of the form `$(CC) -c $(CPPFLAGS) $(CFLAGS) $^ -o $@` 332 | - Compiling a C++ program: `n.o` is made automatically from `n.cc` or `n.cpp` with a command of the form `$(CXX) -c $(CPPFLAGS) $(CXXFLAGS) $^ -o $@` 333 | - Linking a single object file: `n` is made automatically from `n.o` by running the command `$(CC) $(LDFLAGS) $^ $(LOADLIBES) $(LDLIBS) -o $@` 334 | 335 | The important variables used by implicit rules are: 336 | - `CC`: Program for compiling C programs; default `cc` 337 | - `CXX`: Program for compiling C++ programs; default `g++` 338 | - `CFLAGS`: Extra flags to give to the C compiler 339 | - `CXXFLAGS`: Extra flags to give to the C++ compiler 340 | - `CPPFLAGS`: Extra flags to give to the C preprocessor 341 | - `LDFLAGS`: Extra flags to give to compilers when they are supposed to invoke the linker 342 | 343 | Let's see how we can now build a C program without ever explicitly telling Make how to do the compilation: 344 | ```makefile 345 | CC = gcc # Flag for implicit rules 346 | CFLAGS = -g # Flag for implicit rules. Turn on debug info 347 | 348 | # Implicit rule #1: blah is built via the C linker implicit rule 349 | # Implicit rule #2: blah.o is built via the C compilation implicit rule, because blah.c exists 350 | blah: blah.o 351 | 352 | blah.c: 353 | echo "int main() { return 0; }" > blah.c 354 | 355 | clean: 356 | rm -f blah* 357 | ``` 358 | 359 | ## Static Pattern Rules 360 | 361 | Static pattern rules are another way to write less in a Makefile. Here's their syntax: 362 | ```makefile 363 | targets...: target-pattern: prereq-patterns ... 364 | commands 365 | ``` 366 | 367 | The essence is that the given `target` is matched by the `target-pattern` (via a `%` wildcard). Whatever was matched is called the *stem*. The stem is then substituted into the `prereq-pattern`, to generate the target's prereqs. 368 | 369 | A typical use case is to compile `.c` files into `.o` files. Here's the *manual way*: 370 | ```makefile 371 | objects = foo.o bar.o all.o 372 | all: $(objects) 373 | $(CC) $^ -o all 374 | 375 | foo.o: foo.c 376 | $(CC) -c foo.c -o foo.o 377 | 378 | bar.o: bar.c 379 | $(CC) -c bar.c -o bar.o 380 | 381 | all.o: all.c 382 | $(CC) -c all.c -o all.o 383 | 384 | all.c: 385 | echo "int main() { return 0; }" > all.c 386 | 387 | # Note: all.c does not use this rule because Make prioritizes more specific matches when there is more than one match. 388 | %.c: 389 | touch $@ 390 | 391 | clean: 392 | rm -f *.c *.o all 393 | ``` 394 | 395 | Here's the more *efficient way*, using a static pattern rule: 396 | ```makefile 397 | objects = foo.o bar.o all.o 398 | all: $(objects) 399 | $(CC) $^ -o all 400 | 401 | # Syntax - targets ...: target-pattern: prereq-patterns ... 402 | # In the case of the first target, foo.o, the target-pattern matches foo.o and sets the "stem" to be "foo". 403 | # It then replaces the '%' in prereq-patterns with that stem 404 | $(objects): %.o: %.c 405 | $(CC) -c $^ -o $@ 406 | 407 | all.c: 408 | echo "int main() { return 0; }" > all.c 409 | 410 | # Note: all.c does not use this rule because Make prioritizes more specific matches when there is more than one match. 411 | %.c: 412 | touch $@ 413 | 414 | clean: 415 | rm -f *.c *.o all 416 | ``` 417 | 418 | ## Static Pattern Rules and Filter 419 | 420 | While I introduce the [filter function](#the-filter-function) later on, it's common to use in static pattern rules, so I'll mention that here. The `filter` function can be used in Static pattern rules to match the correct files. In this example, I made up the `.raw` and `.result` extensions. 421 | ```makefile 422 | obj_files = foo.result bar.o lose.o 423 | src_files = foo.raw bar.c lose.c 424 | 425 | all: $(obj_files) 426 | # Note: PHONY is important here. Without it, implicit rules will try to build the executable "all", since the prereqs are ".o" files. 427 | .PHONY: all 428 | 429 | # Ex 1: .o files depend on .c files. Though we don't actually make the .o file. 430 | $(filter %.o,$(obj_files)): %.o: %.c 431 | echo "target: $@ prereq: $<" 432 | 433 | # Ex 2: .result files depend on .raw files. Though we don't actually make the .result file. 434 | $(filter %.result,$(obj_files)): %.result: %.raw 435 | echo "target: $@ prereq: $<" 436 | 437 | %.c %.raw: 438 | touch $@ 439 | 440 | clean: 441 | rm -f $(src_files) 442 | ``` 443 | 444 | 445 | 446 | ## Pattern Rules 447 | Pattern rules are often used but quite confusing. You can look at them as two ways: 448 | - A way to define your own implicit rules 449 | - A simpler form of static pattern rules 450 | 451 | Let's start with an example first: 452 | ```makefile 453 | # Define a pattern rule that compiles every .c file into a .o file 454 | %.o : %.c 455 | $(CC) -c $(CFLAGS) $(CPPFLAGS) $< -o $@ 456 | ``` 457 | 458 | Pattern rules contain a '%' in the target. This '%' matches any nonempty string, and the other characters match themselves. ‘%’ in a prerequisite of a pattern rule stands for the same stem that was matched by the ‘%’ in the target. 459 | 460 | Here's another example: 461 | ```makefile 462 | # Define a pattern rule that has no pattern in the prerequisites. 463 | # This just creates empty .c files when needed. 464 | %.c: 465 | touch $@ 466 | ``` 467 | 468 | ## Double-Colon Rules 469 | 470 | Double-Colon Rules are rarely used, but allow multiple rules to be defined for the same target. If these were single colons, a warning would be printed and only the second set of commands would run. 471 | ```makefile 472 | all: blah 473 | 474 | blah:: 475 | echo "hello" 476 | 477 | blah:: 478 | echo "hello again" 479 | ``` 480 | 481 | 482 | # Commands and execution 483 | ## Command Echoing/Silencing 484 | 485 | Add an `@` before a command to stop it from being printed 486 | You can also run make with `-s` to add an `@` before each line 487 | ```makefile 488 | all: 489 | @echo "This make line will not be printed" 490 | echo "But this will" 491 | ``` 492 | 493 | ## Command Execution 494 | 495 | Each command is run in a new shell (or at least the effect is as such) 496 | ```makefile 497 | all: 498 | cd .. 499 | # The cd above does not affect this line, because each command is effectively run in a new shell 500 | echo `pwd` 501 | 502 | # This cd command affects the next because they are on the same line 503 | cd ..;echo `pwd` 504 | 505 | # Same as above 506 | cd ..; \ 507 | echo `pwd` 508 | 509 | ``` 510 | 511 | ## Default Shell 512 | 513 | The default shell is `/bin/sh`. You can change this by changing the variable SHELL: 514 | ```makefile 515 | SHELL=/bin/bash 516 | 517 | cool: 518 | echo "Hello from bash" 519 | ``` 520 | 521 | ## Double dollar sign 522 | If you want a string to have a dollar sign, you can use `$$`. This is how to use a shell variable in `bash` or `sh`. 523 | 524 | Note the differences between Makefile variables and Shell variables in this next example. 525 | ```makefile 526 | make_var = I am a make variable 527 | all: 528 | # Same as running "sh_var='I am a shell variable'; echo $sh_var" in the shell 529 | sh_var='I am a shell variable'; echo $$sh_var 530 | 531 | # Same as running "echo I am a make variable" in the shell 532 | echo $(make_var) 533 | ``` 534 | 535 | ## Error handling with `-k`, `-i`, and `-` 536 | 537 | Add `-k` when running make to continue running even in the face of errors. Helpful if you want to see all the errors of Make at once. 538 | Add a `-` before a command to suppress the error 539 | Add `-i` to make to have this happen for every command. 540 | 541 | 542 | ```makefile 543 | one: 544 | # This error will be printed but ignored, and make will continue to run 545 | -false 546 | touch one 547 | 548 | ``` 549 | 550 | ## Interrupting or killing make 551 | 552 | Note only: If you `ctrl+c` make, it will delete the newer targets it just made. 553 | 554 | ## Recursive use of make 555 | 556 | To recursively call a makefile, use the special `$(MAKE)` instead of `make` because it will pass the make flags for you and won't itself be affected by them. 557 | ```makefile 558 | new_contents = "hello:\n\ttouch inside_file" 559 | all: 560 | mkdir -p subdir 561 | printf $(new_contents) | sed -e 's/^ //' > subdir/makefile 562 | cd subdir && $(MAKE) 563 | 564 | clean: 565 | rm -rf subdir 566 | 567 | ``` 568 | 569 | ## Export, environments, and recursive make 570 | 571 | When Make starts, it automatically creates Make variables out of all the environment variables that are set when it's executed. 572 | ```makefile 573 | # Run this with "export shell_env_var='I am an environment variable'; make" 574 | all: 575 | # Print out the Shell variable 576 | echo $$shell_env_var 577 | 578 | # Print out the Make variable 579 | echo $(shell_env_var) 580 | ``` 581 | 582 | The `export` directive takes a variable and sets it the environment for all shell commands in all the recipes: 583 | 584 | ```makefile 585 | shell_env_var=Shell env var, created inside of Make 586 | export shell_env_var 587 | all: 588 | echo $(shell_env_var) 589 | echo $$shell_env_var 590 | ``` 591 | 592 | As such, when you run the `make` command inside of make, you can use the `export` directive to make it accessible to sub-make commands. In this example, `cooly` is exported such that the makefile in subdir can use it. 593 | 594 | ```makefile 595 | new_contents = "hello:\n\techo \$$(cooly)" 596 | 597 | all: 598 | mkdir -p subdir 599 | printf $(new_contents) | sed -e 's/^ //' > subdir/makefile 600 | @echo "---MAKEFILE CONTENTS---" 601 | @cd subdir && cat makefile 602 | @echo "---END MAKEFILE CONTENTS---" 603 | cd subdir && $(MAKE) 604 | 605 | # Note that variables and exports. They are set/affected globally. 606 | cooly = "The subdirectory can see me!" 607 | export cooly 608 | # This would nullify the line above: unexport cooly 609 | 610 | clean: 611 | rm -rf subdir 612 | ``` 613 | 614 | 615 | You need to export variables to have them run in the shell as well. 616 | ```makefile 617 | one=this will only work locally 618 | export two=we can run subcommands with this 619 | 620 | all: 621 | @echo $(one) 622 | @echo $$one 623 | @echo $(two) 624 | @echo $$two 625 | ``` 626 | 627 | 628 | `.EXPORT_ALL_VARIABLES` exports all variables for you. 629 | ```makefile 630 | .EXPORT_ALL_VARIABLES: 631 | new_contents = "hello:\n\techo \$$(cooly)" 632 | 633 | cooly = "The subdirectory can see me!" 634 | # This would nullify the line above: unexport cooly 635 | 636 | all: 637 | mkdir -p subdir 638 | printf $(new_contents) | sed -e 's/^ //' > subdir/makefile 639 | @echo "---MAKEFILE CONTENTS---" 640 | @cd subdir && cat makefile 641 | @echo "---END MAKEFILE CONTENTS---" 642 | cd subdir && $(MAKE) 643 | 644 | clean: 645 | rm -rf subdir 646 | ``` 647 | 648 | ## Arguments to make 649 | 650 | 651 | There's a nice [list of options](http://www.gnu.org/software/make/manual/make.html#Options-Summary) that can be run from make. Check out `--dry-run`, `--touch`, `--old-file`. 652 | 653 | You can have multiple targets to make, i.e. `make clean run test` runs the `clean` goal, then `run`, and then `test`. 654 | 655 | # Variables Pt. 2 656 | ## Flavors and modification 657 | 658 | There are two flavors of variables: 659 | - recursive (use `=`) - only looks for the variables when the command is *used*, not when it's *defined*. 660 | - simply expanded (use `:=`) - like normal imperative programming -- only those defined so far get expanded 661 | 662 | ```makefile 663 | # Recursive variable. This will print "later" below 664 | one = one ${later_variable} 665 | # Simply expanded variable. This will not print "later" below 666 | two := two ${later_variable} 667 | 668 | later_variable = later 669 | 670 | all: 671 | echo $(one) 672 | echo $(two) 673 | ``` 674 | 675 | Simply expanded (using `:=`) allows you to append to a variable. Recursive definitions will give an infinite loop error. 676 | ```makefile 677 | one = hello 678 | # one gets defined as a simply expanded variable (:=) and thus can handle appending 679 | one := ${one} there 680 | 681 | all: 682 | echo $(one) 683 | ``` 684 | 685 | `?=` only sets variables if they have not yet been set 686 | ```makefile 687 | one = hello 688 | one ?= will not be set 689 | two ?= will be set 690 | 691 | all: 692 | echo $(one) 693 | echo $(two) 694 | ``` 695 | 696 | Spaces at the end of a line are not stripped, but those at the start are. To make a variable with a single space, use `$(nullstring)` 697 | ```makefile 698 | with_spaces = hello # with_spaces has many spaces after "hello" 699 | after = $(with_spaces)there 700 | 701 | nullstring = 702 | space = $(nullstring) # Make a variable with a single space. 703 | 704 | all: 705 | echo "$(after)" 706 | echo start"$(space)"end 707 | ``` 708 | 709 | An undefined variable is actually an empty string! 710 | ```makefile 711 | all: 712 | # Undefined variables are just empty strings! 713 | echo $(nowhere) 714 | ``` 715 | 716 | Use `+=` to append 717 | ```makefile 718 | foo := start 719 | foo += more 720 | 721 | all: 722 | echo $(foo) 723 | ``` 724 | 725 | [String Substitution](#string-substitution) is also a really common and useful way to modify variables. Also check out [Text Functions](https://www.gnu.org/software/make/manual/html_node/Text-Functions.html#Text-Functions) and [Filename Functions](https://www.gnu.org/software/make/manual/html_node/File-Name-Functions.html#File-Name-Functions). 726 | 727 | ## Command line arguments and override 728 | 729 | You can override variables that come from the command line by using `override`. 730 | Here we ran make with `make option_one=hi` 731 | ```makefile 732 | # Overrides command line arguments 733 | override option_one = did_override 734 | # Does not override command line arguments 735 | option_two = not_override 736 | all: 737 | echo $(option_one) 738 | echo $(option_two) 739 | ``` 740 | 741 | ## List of commands and define 742 | 743 | The [define directive](https://www.gnu.org/software/make/manual/html_node/Multi_002dLine.html) is not a function, though it may look that way. I've seen it used so infrequently that I won't go into details, but it's mainly used for defining [canned recipes](https://www.gnu.org/software/make/manual/html_node/Canned-Recipes.html#Canned-Recipes) and also pairs well with the [eval function](https://www.gnu.org/software/make/manual/html_node/Eval-Function.html#Eval-Function). 744 | 745 | `define`/`endef` simply creates a variable that is set to a list of commands. Note here that it's a bit different than having a semi-colon between commands, because each is run in a separate shell, as expected. 746 | ```makefile 747 | one = export blah="I was set!"; echo $$blah 748 | 749 | define two 750 | export blah="I was set!" 751 | echo $$blah 752 | endef 753 | 754 | all: 755 | @echo "This prints 'I was set'" 756 | @$(one) 757 | @echo "This does not print 'I was set' because each command runs in a separate shell" 758 | @$(two) 759 | ``` 760 | 761 | ## Target-specific variables 762 | 763 | Variables can be set for specific targets 764 | ```makefile 765 | all: one = cool 766 | 767 | all: 768 | echo one is defined: $(one) 769 | 770 | other: 771 | echo one is nothing: $(one) 772 | ``` 773 | 774 | ## Pattern-specific variables 775 | 776 | You can set variables for specific target *patterns* 777 | ```makefile 778 | %.c: one = cool 779 | 780 | blah.c: 781 | echo one is defined: $(one) 782 | 783 | other: 784 | echo one is nothing: $(one) 785 | ``` 786 | 787 | # Conditional part of Makefiles 788 | ## Conditional if/else 789 | 790 | ```makefile 791 | foo = ok 792 | 793 | all: 794 | ifeq ($(foo), ok) 795 | echo "foo equals ok" 796 | else 797 | echo "nope" 798 | endif 799 | ``` 800 | 801 | ## Check if a variable is empty 802 | 803 | ```makefile 804 | nullstring = 805 | foo = $(nullstring) # end of line; there is a space here 806 | 807 | all: 808 | ifeq ($(strip $(foo)),) 809 | echo "foo is empty after being stripped" 810 | endif 811 | ifeq ($(nullstring),) 812 | echo "nullstring doesn't even have spaces" 813 | endif 814 | ``` 815 | 816 | ## Check if a variable is defined 817 | 818 | ifdef does not expand variable references; it just sees if something is defined at all 819 | ```makefile 820 | bar = 821 | foo = $(bar) 822 | 823 | all: 824 | ifdef foo 825 | echo "foo is defined" 826 | endif 827 | ifndef bar 828 | echo "but bar is not" 829 | endif 830 | 831 | ``` 832 | 833 | ## $(MAKEFLAGS) 834 | 835 | This example shows you how to test make flags with `findstring` and `MAKEFLAGS`. Run this example with `make -i` to see it print out the echo statement. 836 | ```makefile 837 | all: 838 | # Search for the "-i" flag. MAKEFLAGS is just a list of single characters, one per flag. So look for "i" in this case. 839 | ifneq (,$(findstring i, $(MAKEFLAGS))) 840 | echo "i was passed to MAKEFLAGS" 841 | endif 842 | ``` 843 | 844 | # Functions 845 | ## First Functions 846 | 847 | *Functions* are mainly just for text processing. Call functions with `$(fn, arguments)` or `${fn, arguments}`. Make has a decent amount of [builtin functions](https://www.gnu.org/software/make/manual/html_node/Functions.html). 848 | ```makefile 849 | bar := ${subst not,"totally", "I am not superman"} 850 | all: 851 | @echo $(bar) 852 | 853 | ``` 854 | 855 | If you want to replace spaces or commas, use variables 856 | ```makefile 857 | comma := , 858 | empty:= 859 | space := $(empty) $(empty) 860 | foo := a b c 861 | bar := $(subst $(space),$(comma),$(foo)) 862 | 863 | all: 864 | @echo $(bar) 865 | ``` 866 | 867 | Do NOT include spaces in the arguments after the first. That will be seen as part of the string. 868 | ```makefile 869 | comma := , 870 | empty:= 871 | space := $(empty) $(empty) 872 | foo := a b c 873 | bar := $(subst $(space), $(comma) , $(foo)) # Watch out! 874 | 875 | all: 876 | # Output is ", a , b , c". Notice the spaces introduced 877 | @echo $(bar) 878 | 879 | ``` 880 | 881 | 884 | 885 | ## String Substitution 886 | `$(patsubst pattern,replacement,text)` does the following: 887 | 888 | "Finds whitespace-separated words in text that match pattern and replaces them with replacement. Here pattern may contain a ‘%’ which acts as a wildcard, matching any number of any characters within a word. If replacement also contains a ‘%’, the ‘%’ is replaced by the text that matched the ‘%’ in pattern. Only the first ‘%’ in the pattern and replacement is treated this way; any subsequent ‘%’ is unchanged." ([GNU docs](https://www.gnu.org/software/make/manual/html_node/Text-Functions.html#Text-Functions)) 889 | 890 | The substitution reference `$(text:pattern=replacement)` is a shorthand for this. 891 | 892 | There's another shorthand that replaces only suffixes: `$(text:suffix=replacement)`. No `%` wildcard is used here. 893 | 894 | Note: don't add extra spaces for this shorthand. It will be seen as a search or replacement term. 895 | 896 | ```makefile 897 | foo := a.o b.o l.a c.o 898 | one := $(patsubst %.o,%.c,$(foo)) 899 | # This is a shorthand for the above 900 | two := $(foo:%.o=%.c) 901 | # This is the suffix-only shorthand, and is also equivalent to the above. 902 | three := $(foo:.o=.c) 903 | 904 | all: 905 | echo $(one) 906 | echo $(two) 907 | echo $(three) 908 | ``` 909 | 910 | ## The foreach function 911 | 912 | The foreach function looks like this: `$(foreach var,list,text)`. It converts one list of words (separated by spaces) to another. `var` is set to each word in list, and `text` is expanded for each word. 913 | This appends an exclamation after each word: 914 | ```makefile 915 | foo := who are you 916 | # For each "word" in foo, output that same word with an exclamation after 917 | bar := $(foreach wrd,$(foo),$(wrd)!) 918 | 919 | all: 920 | # Output is "who! are! you!" 921 | @echo $(bar) 922 | ``` 923 | 924 | ## The if function 925 | 926 | `if` checks if the first argument is nonempty. If so, runs the second argument, otherwise runs the third. 927 | ```makefile 928 | foo := $(if this-is-not-empty,then!,else!) 929 | empty := 930 | bar := $(if $(empty),then!,else!) 931 | 932 | all: 933 | @echo $(foo) 934 | @echo $(bar) 935 | ``` 936 | 937 | ## The call function 938 | 939 | Make supports creating basic functions. You "define" the function just by creating a variable, but use the parameters `$(0)`, `$(1)`, etc. You then call the function with the special [`call`](https://www.gnu.org/software/make/manual/html_node/Call-Function.html#Call-Function) builtin function. The syntax is `$(call variable,param,param)`. `$(0)` is the variable, while `$(1)`, `$(2)`, etc. are the params. 940 | 941 | ```makefile 942 | sweet_new_fn = Variable Name: $(0) First: $(1) Second: $(2) Empty Variable: $(3) 943 | 944 | all: 945 | # Outputs "Variable Name: sweet_new_fn First: go Second: tigers Empty Variable:" 946 | @echo $(call sweet_new_fn, go, tigers) 947 | ``` 948 | 949 | ## The shell function 950 | 951 | shell - This calls the shell, but it replaces newlines with spaces! 952 | ```makefile 953 | all: 954 | @echo $(shell ls -la) # Very ugly because the newlines are gone! 955 | ``` 956 | 957 | 958 | ## The filter function 959 | 960 | The `filter` function is used to select certain elements from a list that match a specific pattern. For example, this will select all elements in `obj_files` that end with `.o`. 961 | 962 | ```makefile 963 | obj_files = foo.result bar.o lose.o 964 | filtered_files = $(filter %.o,$(obj_files)) 965 | 966 | all: 967 | @echo $(filtered_files) 968 | ``` 969 | 970 | Filter can also be used in more complex ways: 971 | 972 | 1. **Filtering multiple patterns**: You can filter multiple patterns at once. For example, `$(filter %.c %.h, $(files))` will select all `.c` and `.h` files from the files list. 973 | 974 | 1. **Negation**: If you want to select all elements that do not match a pattern, you can use `filter-out`. For example, `$(filter-out %.h, $(files))` will select all files that are not `.h` files. 975 | 976 | 1. **Nested filter**: You can nest filter functions to apply multiple filters. For example, `$(filter %.o, $(filter-out test%, $(objects)))` will select all object files that end with `.o` but don't start with `test`. 977 | 978 | # Other Features 979 | ## Include Makefiles 980 | The include directive tells make to read one or more other makefiles. It's a line in the makefile that looks like this: 981 | ```makefile 982 | include filenames... 983 | ``` 984 | 985 | This is particularly useful when you use compiler flags like `-M` that create Makefiles based on the source. For example, if some c files includes a header, that header will be added to a Makefile that's written by gcc. I talk about this more in the [Makefile Cookbook](#makefile-cookbook) 986 | 987 | ## The vpath Directive 988 | 989 | Use vpath to specify where some set of prerequisites exist. The format is `vpath ` 990 | `` can have a `%`, which matches any zero or more characters. 991 | You can also do this globallyish with the variable VPATH 992 | ```makefile 993 | vpath %.h ../headers ../other-directory 994 | 995 | # Note: vpath allows blah.h to be found even though blah.h is never in the current directory 996 | some_binary: ../headers blah.h 997 | touch some_binary 998 | 999 | ../headers: 1000 | mkdir ../headers 1001 | 1002 | # We call the target blah.h instead of ../headers/blah.h, because that's the prereq that some_binary is looking for 1003 | # Typically, blah.h would already exist and you wouldn't need this. 1004 | blah.h: 1005 | touch ../headers/blah.h 1006 | 1007 | clean: 1008 | rm -rf ../headers 1009 | rm -f some_binary 1010 | 1011 | ``` 1012 | 1013 | ## Multiline 1014 | The backslash ("\\") character gives us the ability to use multiple lines when the commands are too long 1015 | ```makefile 1016 | some_file: 1017 | echo This line is too long, so \ 1018 | it is broken up into multiple lines 1019 | ``` 1020 | 1021 | ## .phony 1022 | Adding `.PHONY` to a target will prevent Make from confusing the phony target with a file name. In this example, if the file `clean` is created, make clean will still be run. Technically, I should have used it in every example with `all` or `clean`, but I wanted to keep the examples clean. Additionally, "phony" targets typically have names that are rarely file names, and in practice many people skip this. 1023 | ```makefile 1024 | some_file: 1025 | touch some_file 1026 | touch clean 1027 | 1028 | .PHONY: clean 1029 | clean: 1030 | rm -f some_file 1031 | rm -f clean 1032 | ``` 1033 | 1034 | ## .delete_on_error 1035 | 1036 | 1037 | The make tool will stop running a rule (and will propagate back to prerequisites) if a command returns a nonzero exit status. 1038 | `DELETE_ON_ERROR` will delete the target of a rule if the rule fails in this manner. This will happen for all targets, not just the one it is before like PHONY. It's a good idea to always use this, even though make does not for historical reasons. 1039 | 1040 | ```makefile 1041 | .DELETE_ON_ERROR: 1042 | all: one two 1043 | 1044 | one: 1045 | touch one 1046 | false 1047 | 1048 | two: 1049 | touch two 1050 | false 1051 | ``` 1052 | 1053 | # Makefile Cookbook 1054 | Let's go through a really juicy Make example that works well for medium sized projects. 1055 | 1056 | The neat thing about this makefile is it automatically determines dependencies for you. All you have to do is put your C/C++ files in the `src/` folder. 1057 | 1058 | ```makefile 1059 | # Thanks to Job Vranish (https://spin.atomicobject.com/2016/08/26/makefile-c-projects/) 1060 | TARGET_EXEC := final_program 1061 | 1062 | BUILD_DIR := ./build 1063 | SRC_DIRS := ./src 1064 | 1065 | # Find all the C and C++ files we want to compile 1066 | # Note the single quotes around the * expressions. The shell will incorrectly expand these otherwise, but we want to send the * directly to the find command. 1067 | SRCS := $(shell find $(SRC_DIRS) -name '*.cpp' -or -name '*.c' -or -name '*.s') 1068 | 1069 | # Prepends BUILD_DIR and appends .o to every src file 1070 | # As an example, ./your_dir/hello.cpp turns into ./build/./your_dir/hello.cpp.o 1071 | OBJS := $(SRCS:%=$(BUILD_DIR)/%.o) 1072 | 1073 | # String substitution (suffix version without %). 1074 | # As an example, ./build/hello.cpp.o turns into ./build/hello.cpp.d 1075 | DEPS := $(OBJS:.o=.d) 1076 | 1077 | # Every folder in ./src will need to be passed to GCC so that it can find header files 1078 | INC_DIRS := $(shell find $(SRC_DIRS) -type d) 1079 | # Add a prefix to INC_DIRS. So moduleA would become -ImoduleA. GCC understands this -I flag 1080 | INC_FLAGS := $(addprefix -I,$(INC_DIRS)) 1081 | 1082 | # The -MMD and -MP flags together generate Makefiles for us! 1083 | # These files will have .d instead of .o as the output. 1084 | CPPFLAGS := $(INC_FLAGS) -MMD -MP 1085 | 1086 | # The final build step. 1087 | $(BUILD_DIR)/$(TARGET_EXEC): $(OBJS) 1088 | $(CXX) $(OBJS) -o $@ $(LDFLAGS) 1089 | 1090 | # Build step for C source 1091 | $(BUILD_DIR)/%.c.o: %.c 1092 | mkdir -p $(dir $@) 1093 | $(CC) $(CPPFLAGS) $(CFLAGS) -c $< -o $@ 1094 | 1095 | # Build step for C++ source 1096 | $(BUILD_DIR)/%.cpp.o: %.cpp 1097 | mkdir -p $(dir $@) 1098 | $(CXX) $(CPPFLAGS) $(CXXFLAGS) -c $< -o $@ 1099 | 1100 | 1101 | .PHONY: clean 1102 | clean: 1103 | rm -r $(BUILD_DIR) 1104 | 1105 | # Include the .d makefiles. The - at the front suppresses the errors of missing 1106 | # Makefiles. Initially, all the .d files will be missing, and we don't want those 1107 | # errors to show up. 1108 | -include $(DEPS) 1109 | ``` 1110 | 1111 | 1149 | -------------------------------------------------------------------------------- /src/main.scss: -------------------------------------------------------------------------------- 1 | $sidebar-width: 300px; 2 | $page-width: 1280px; 3 | $small-space: 8px; 4 | $med-space: 16px; 5 | $mobile-phone-max: 480px; 6 | 7 | html { 8 | scroll-behavior: smooth; 9 | tab-size: 2; 10 | min-width: 320px; 11 | } 12 | 13 | #left { 14 | font-size: 14px; 15 | // padding-left: 8px; 16 | ol { 17 | padding: 0; 18 | margin: 0; 19 | } 20 | ol > ol { 21 | margin-left: $med-space; 22 | } 23 | li { 24 | margin-top: 8px; 25 | list-style: none; 26 | } 27 | .active a { 28 | color: #002b36; 29 | // font-weight: bold; 30 | } 31 | } 32 | 33 | pre { 34 | overflow: auto; 35 | } 36 | 37 | html { 38 | height: 100%; 39 | font-family: system-ui, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 40 | 'Segoe UI Emoji', 'Segoe UI Symbol'; 41 | // font-family: 'Roboto', serif; 42 | line-height: 1.3; 43 | font-size: 16px; 44 | color: #586e75; 45 | } 46 | 47 | a { 48 | // color: #4078c0; 49 | color: #839496; 50 | text-decoration: none; 51 | } 52 | 53 | a:hover { 54 | text-decoration: underline; 55 | } 56 | 57 | p { 58 | margin: $med-space 0 0 0; 59 | } 60 | 61 | pre { 62 | margin: 8px 0 0 0; 63 | } 64 | 65 | h1 { 66 | margin: 32px 0 0 0; 67 | font-weight: 600; 68 | } 69 | 70 | h1, 71 | h2, 72 | h3, 73 | .intro-header { 74 | color: #002b36; 75 | } 76 | 77 | h2 { 78 | margin: $med-space 0 0 0; 79 | font-weight: 400; 80 | } 81 | 82 | * { 83 | min-width: 0; /* Otherwise
 blocks take up more space then they should. Needed for flexbox. */
 84 |   box-sizing: border-box;
 85 | }
 86 | 
 87 | body {
 88 |   height: 100%;
 89 |   width: 100%;
 90 |   margin: 0px; /*removes default style*/
 91 |   box-sizing: border-box;
 92 |   position: relative;
 93 | }
 94 | 
 95 | #header {
 96 |   max-width: $page-width;
 97 |   position: relative;
 98 |   margin-left: auto;
 99 |   margin-right: auto;
100 |   // height: 300px;
101 |   margin-top: 16px;
102 |   .header-inside {
103 |     display: flex;
104 |     justify-content: center;
105 |     @media (max-width: $mobile-phone-max) {
106 |       display: block;
107 |     }
108 |   }
109 |   .title-left {
110 |     display: flex;
111 |     flex-direction: column;
112 |     justify-content: center;
113 |     align-items: stetch;
114 |   }
115 |   .title-pic {
116 |     width: 560px;
117 |     height: 257px; // Hmm, Safari also needs height
118 |     margin-left: 8px;
119 |   }
120 |   .title-wrapper {
121 |     display: flex;
122 |     justify-content: center;
123 |     color: black;
124 |     margin: 0 0;
125 |     .title {
126 |       font-size: 60px;
127 |       @media (max-width: $mobile-phone-max) {
128 |         font-size: 45px;
129 |       }
130 |     }
131 |     .subtitle {
132 |       font-size: 30px;
133 |       @media (max-width: $mobile-phone-max) {
134 |         font-size: 20px;
135 |         margin-bottom: 16px;
136 |       }
137 |     }
138 |   }
139 |   .social-buttons {
140 |     display: flex;
141 |     justify-content: center;
142 |   }
143 |   .intro-buttons {
144 |     display: flex;
145 |     justify-content: space-between;
146 |     flex-flow: row wrap;
147 |     text-align: center;
148 |     @media (max-width: $mobile-phone-max) {
149 |       flex-direction: column;
150 |       margin-bottom: 8px;
151 |     }
152 |     a:first-child {
153 |       margin-right: 16px;
154 |     }
155 |     a {
156 |       @media (max-width: $mobile-phone-max) {
157 |         margin: 0 16px 8px 16px;
158 |       }
159 |       display: inline-block;
160 |       background-color: #2aa198;
161 |       // background-color: #AD00FF;
162 |       color: white;
163 |       font-size: 18px;
164 |       padding: 16px 32px;
165 |       border: 0px;
166 |       border-radius: 8px;
167 |       // box-shadow: 0 2px 4px rgba(0, 0, 0, .25);
168 |       cursor: pointer;
169 |       margin: 20px 0px;
170 |     }
171 |     a:hover {
172 |       background-color: #27968d;
173 |       text-decoration: none;
174 |     }
175 |   }
176 | }
177 | 
178 | .body-wrapper {
179 |   max-width: $page-width;
180 |   position: relative;
181 |   margin-left: auto;
182 |   margin-right: auto;
183 |   padding: 0 16px 0 16px;
184 | }
185 | 
186 | .social-buttons img {
187 |   width: 25px;
188 |   height: 25px;
189 |   margin-right: 10px;
190 | }
191 | 
192 | #left {
193 |   top: 0;
194 |   position: sticky;
195 |   width: $sidebar-width;
196 |   float: left;
197 |   height: 100vh;
198 |   display: flex;
199 |   flex-direction: column;
200 |   .sidebar-header {
201 |     border-bottom: 1px solid #eee;
202 |     box-shadow: -20px 0px 20px 0px white;
203 |     z-index: 2;
204 |     .social-buttons {
205 |       display: flex;
206 |       justify-content: left;
207 |     }
208 |     .sidebar-title a {
209 |       display: flex;
210 |       justify-content: left;
211 |       font-size: 32px;
212 |       color: black;
213 |     }
214 |     .sidebar-title a:hover {
215 |       text-decoration: none;
216 |     }
217 |     .github-stars {
218 |       margin-top: 3px;
219 |     }
220 |   }
221 |   .toc {
222 |     overflow-y: hidden;
223 |     padding-bottom: 16px;
224 |   }
225 |   .toc:hover {
226 |     overflow-y: auto;
227 |   }
228 | }
229 | 
230 | #right {
231 |   margin-left: calc(32px + #{$sidebar-width});
232 |   a {
233 |     color: #2aa198;
234 |   }
235 | }
236 | 
237 | .content {
238 |   padding-bottom: 36px; // Not sure why padding doesn't work
239 |   ul {
240 |     margin: 8px 0 0 32px;
241 |     padding: 0;
242 |     list-style: none;
243 |     // list-style-position: inside;
244 |   }
245 |   ul li {
246 |     line-height: 16px;
247 |     margin-top: 8px;
248 |   }
249 |   ul li::before {
250 |     content: '\2022'; /* Add content: \2022 is the CSS Code/unicode for a bullet */
251 |     color: #c1c9d2; /* Change the color */
252 |     font-weight: bold; /* If you want it to be bold */
253 |     display: inline-block; /* Needed to add space between the bullet and the text */
254 |     width: 24px; /* Also needed for space (tweak if needed) */
255 |     margin-left: -24px; /* Also needed for space (tweak if needed) */
256 |   }
257 | }
258 | 
259 | .yt-video {
260 |   display: flex;
261 |   justify-content: center;
262 |   margin-top: 16px;
263 | }
264 | 
265 | code {
266 |   color: #002b36;
267 |   border-radius: 4px;
268 |   background-color: #eef1f1;
269 |   font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;
270 |   padding: 0px 8px;
271 |   font-size: 14px;
272 | }
273 | 
274 | pre code {
275 |   border-radius: 8px;
276 |   font-size: 16px;
277 |   padding: 0px;
278 |   @media (max-width: $mobile-phone-max) {
279 |     font-size: 12px;
280 |   }
281 | }
282 | 
283 | .center {
284 |   display: flex;
285 |   justify-content: center;
286 | }
287 | 
288 | #header .social-buttons {
289 |   display: none;
290 | }
291 | 
292 | @media (max-width: 1020px) {
293 |   .title-pic {
294 |     display: none;
295 |   }
296 |   #left {
297 |     display: none;
298 |   }
299 |   #right {
300 |     margin-left: 0px;
301 |   }
302 |   #header .social-buttons {
303 |     display: flex;
304 |   }
305 | }
306 | 


--------------------------------------------------------------------------------
/src/screencasts.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Makefile Tutorial
 3 | draft: false
 4 | collection: Get Started
 5 | layout: layout.ejs
 6 | date: 2016-12-24
 7 | autotoc: true
 8 | ---
 9 | 
10 | # Getting started video
11 | 
12 | 


--------------------------------------------------------------------------------