Skip to main content

Home/ Web Development & Mobile App/ Group items tagged grunt

Rss Feed Group items tagged

Filter: All | Bookmarks | Topics Simple Middle
Vernon Fowler

Grunt for People Who Think Things Like Grunt are Weird and Hard ◆ 24 ways - 0 views

24ways.org/...grunt-is-not-weird-and-hard

grunt tutorial javascript css tools webdesign frontend front-end workflow

shared by Vernon Fowler on 03 Feb 14 - No Cached
  • You install Grunt on a per-project basis. Go to your project’s folder. It needs a file there named package.json at the root level. You can just create one and put it there.
  • The contents of that file should be this: { "name": "example-project", "version": "0.1.0", "devDependencies": { "grunt": "~0.4.1" } }
  • Once that package.json file is in place, go to the terminal and navigate to your folder.
  • ...3 more annotations...
  • Then run the command: npm install
  • This is a one-liner again. Just run this command in the terminal: npm install -g grunt-cli
  • You should close and reopen the terminal as well. That’s a generic good practice to make sure things are working right.
Vernon Fowler

grunt-grunticon - 0 views

npmjs.org/...grunt-grunticon

javascript automation workflow css webdesign icons vector svg images

shared by Vernon Fowler on 22 Jan 14 - No Cached
  • Vernon Fowler on 22 Jan 14
     
    "A mystical CSS icon solution"
Vernon Fowler

Working With LESS and the Chrome DevTools - Tuts+ Code Tutorial - 0 views

code.tutsplus.com/...the-chrome-devtools--net-36636

less chrome html markup tools webdesign css workflow source maps workspaces editor editing grunt preprocessor

shared by Vernon Fowler on 11 Feb 14 - Cached
  • While holding Command (Control on Windows), click any property, value or selector to jump to the line of code in the corresponding LESS source file within the Sources panel.
  • In a world without Source Maps, DevTools would display styles originating from the compiled CSS. Line numbering would not be useful due to a mismatch between compiled CSS and the source CSS. With Source Maps, when inspecting a DOM node on the page, DevTools will automatically show the styles originating from the LESS source file.
  • the Sources panel contains a live editor
  • ...2 more annotations...
  • Not only does this work for remotely hosted files, but also for local ones with the added benefit of persisting your changes to a file.
  • You can edit a file in the Sources panel and those changes will persist to disk when you Command/Control-S.
  • Vernon Fowler on 11 Feb 14
     
    This is a complete tutorial to using LESS with Chrome's DevTools. If you've used Sass with Chrome's DevTools, you'll most likely already be familiar with the concepts introduced here.
  • Vernon Fowler on 11 Feb 14
     
    This is a complete tutorial to using LESS with Chrome's DevTools. If you've used Sass with Chrome's DevTools, you'll most likely already be familiar with the concepts introduced here.
  • Vernon Fowler on 12 Feb 14
     
    "This is a complete tutorial to using LESS with Chrome's DevTools. If you've used Sass with Chrome's DevTools, you'll most likely already be familiar with the concepts introduced here. "
1 - 4 of 4
Showing 20▼ items per page