Meta tags:

Headings (most frequently used words):

frameworks, codekit, framework, the, what, are, they, adding, limitations, structuring, using, multiple, source, maps, problem, fix,

Text of the page (most frequently used words):
the (30), codekit (22), you (19), #framework (16), file (15), your (14), frameworks (13), project (10), that (10), folder (8), and (8), import (6), are (6), for (5), copy (4), not (4), cache (4), one (4), from (4), set (4), used (4), scss (4), files (4), projects (4), custom (4), starter (4), this (3), source (3), which (3), write (3), change (3), each (3), can (3), sass (3), use (3), assets (3), other (3), map (2), work (2), original (2), code (2), browser (2), inspector (2), remember (2), will (2), time (2), when (2), named (2), root (2), folders (2), may (2), standard (2), note (2), select (2), has (2), subfolders (2), must (2), include (2), path (2), html (2), those (2), add (2), adding (2), have (2), simply (2), stylesheet (2), now (2), only (2), every (2), javascript (2), new (2), all (2), plugins (2), languages (2), minifier (2), tools (2), postcss (2), browsers (2), steps (2), topics (2), privacy, policy, report, bug, email, support, follow, developer, twitter, made, san, diego, makes, giving, show, see, reference, web, edit, latter, replaced, next, save, create, copies, hidden, directory, maps, possible, define, order, searched, imported, two, both, contain, either, spot, compile, active, open, category, check, should, settings, using, multiple, relative, importing, example, name, subfoldername, keep, don, lets, simple, statements, just, filename, flat, structuring, meant, primarily, scripts, stylesheets, like, images, cannot, because, exist, served, limitations, alternately, choose, menubar, click, plus, button, popover, drop, bottom, section, window, put, then, let, say, called, any, magically, make, there, disk, anytime, automatically, recompiles, imports, fix, some, maybe, with, functions, normally, these, into, but, something, place, got, changes, lose, track, latest, version, problem, groups, shared, across, what, they, faq, upgrading, read, mode, more, coda, sublime, text, atom, nova, editor, scripting, team, workflows, environment, variables, hooks, advanced, eslint, syntax, checkers, jeet, nib, susy, zurb, foundation, bitters, bourbon, bootstrap, tailwind, gif, svg, jpeg, png, webp, image, optimizers, json, markdown, kit, slim, haml, pug, typescript, coffeescript, stylus, less, bless, lightningcss, buster, rollup, bundler, terser, babel, transpiler, npm, purgecss, autoprefixer, license, recovery, troubleshooting, git, stuff, know, target, build, defaults, second, output, paths, action, language, options, sync, live, reload, getting, started, first, close, view, buy, menu, updates, about, help, videos, features,

Text of the page (random words):
codekit codekit frameworks features videos help about updates menu buy now codekit frameworks view topics close topics first steps getting started live reload browsers browser sync set language options set output paths action second steps defaults for new projects build your project set target browsers stuff to know codekit git troubleshooting license recovery postcss tools autoprefixer purgecss custom postcss plugins other tools npm babel js transpiler terser js minifier rollup js bundler cache buster html minifier lightningcss bless languages sass less stylus javascript coffeescript typescript pug haml slim kit markdown json image optimizers webp png jpeg svg gif frameworks codekit frameworks tailwind bootstrap bourbon bitters zurb foundation susy nib jeet syntax checkers eslint advanced hooks environment variables adding custom languages team workflows scripting codekit editor plugins nova atom sublime text coda 2 more read only mode upgrading from 2 0 faq what are they codekit frameworks are simply groups of files that are shared across all your projects the problem you have some code that you use in every project a starter sass stylesheet or maybe a javascript file with custom functions normally you d copy these files into each new project but when you change something in one place you ve got to remember to copy those changes to all the other projects you lose track of which project has the latest version and so on the fix put your custom files in a folder then add that folder to codekit as a codekit framework let s say you have a file called starter scss in your framework you can simply write import starter scss in any project s stylesheet and codekit will magically make it work now there s only one copy of starter scss on your disk and anytime you change it codekit automatically recompiles every file that imports it adding a framework drop your framework s folder on the bottom section of codekit s window alternately choose file add framework from the menubar or click the plus button in the projects popover framework limitations codekit frameworks are meant for assets that can be import ed primarily scripts and stylesheets other assets like images or html files cannot be used in a framework because those assets must exist in the project folder to be served structuring frameworks keep your codekit framework folders flat that is don t use subfolders this lets you write simple import statements that use just a filename if your framework has subfolders you must include the relative path from the framework s root folder to the file you re importing example import subfoldername file sass note that you do not include the name of the framework folder in the path using multiple frameworks you can select which frameworks are active for each project open project settings and select the codekit frameworks category un check the frameworks that should not be used for this project note it is not possible to define the order in which framework folders are searched for an imported file if two codekit frameworks both contain a file named standard scss and you write import standard either framework file may be used in that spot and the one used may change each time you compile the file source maps codekit frameworks when you import from a codekit framework and your file is set to create a source map codekit copies your framework file to a hidden directory named codekit cache at the root of your project this makes the source map work by giving it a copy of the original code to show in your browser s inspector if you see a reference to a file in the codekit cache folder in your web inspector remember to edit the original file in your codekit framework not the file in the cache folder the latter one will be replaced the next time you save made in san diego ca follow the developer on twitter email support report a bug privacy policy