2017-07-10 21:28:39 +00:00
<!DOCTYPE html>
< html class = "no-js" lang = "en-GB" >
< head >
< title > Easier Sculpin Commands with Composer and NPM Scripts | Oliver Davies< / title >
< meta charset = "UTF-8" >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
2017-07-12 06:22:51 +00:00
< meta property = "og:url" content = "https://www.oliverdavies.uk/blog/2017/01/07/easier-sculpin-commands-with-composer-and-npm-scripts" >
2017-07-10 21:28:39 +00:00
< meta property = "og:title" content = "Easier Sculpin Commands with Composer and NPM Scripts" / >
2017-07-12 06:22:51 +00:00
< meta property = "og:image" content = "https://www.oliverdavies.uk/assets/images/me-precedent.jpg" / >
2017-07-10 21:28:39 +00:00
< meta property = "og:image:height" content = "327" / >
< meta property = "og:image:type" content = "image/jpg" >
< meta property = "og:image:width" content = "327" / >
2017-07-12 06:22:51 +00:00
< link rel = "stylesheet" href = "https://www.oliverdavies.uk/assets/css/main.css" >
< link rel = "stylesheet" href = "https://www.oliverdavies.uk/assets/css/blog-post.css" >
2017-07-10 21:28:39 +00:00
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=57" sizes = "57x57" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=114" sizes = "114x114" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=72" sizes = "72x72" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=144" sizes = "144x144" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=60" sizes = "60x60" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=120" sizes = "120x120" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=76" sizes = "76x76" >
< link rel = "apple-touch-icon" href = "/assets/images/me-precedent.jpg?s=152" sizes = "152x152" >
< link rel = "icon" href = "/assets/images/me-precedent.jpg?s=160" sizes = "160x160" >
< link rel = "icon" href = "/assets/images/me-precedent.jpg?s=96" sizes = "96x96" >
< link rel = "icon" href = "/assets/images/me-precedent.jpg?s=32" sizes = "32x32" >
< link rel = "icon" href = "/assets/images/me-precedent.jpg?s=16" sizes = "16x16" >
< / head >
< body class = "" >
< nav class = "navbar navbar-inverse navbar-fixed-top" >
< div class = "container" >
< div class = "navbar-header" >
< button type = "button" class = "navbar-toggle collapsed" data-toggle = "collapse" data-target = "#navbar" aria-expanded = "false" aria-controls = "navbar" >
< span class = "sr-only" > Toggle navigation< / span >
< span class = "icon-bar" > < / span >
< span class = "icon-bar" > < / span >
< span class = "icon-bar" > < / span >
< / button >
2017-07-12 06:22:51 +00:00
< a class = "navbar-brand" href = "https://www.oliverdavies.uk/" > Oliver Davies< / a >
2017-07-10 21:28:39 +00:00
< / div >
< div id = "navbar" class = "collapse navbar-collapse" role = "navigation" >
< ul class = "nav navbar-nav" >
< li class = "" >
< a href = "/" > About< / a >
< / li >
< li class = "" >
< a href = "/experience" > Experience< / a >
< / li >
< li class = "" >
< a href = "/testimonials" > Testimonials< / a >
< / li >
< li class = "" >
< a href = "/talks" > Talks< / a >
< / li >
< li class = "active" >
< a href = "/blog" > Blog< / a >
< / li >
< li class = "" >
< a href = "/contact" > Contact< / a >
< / li >
< / ul >
< / div > < / div >
< / nav >
< div class = "container" >
< div class = "row" >
< main class = "col-md-9" >
< h1 > Easier Sculpin Commands with Composer and NPM Scripts< / h1 >
2017-07-11 17:57:51 +00:00
< p class = "posted text-light" > 7th January 2017< / p >
2017-07-10 21:28:39 +00:00
< p > My website includes several various command line tools - e.g. < a href = "https://sculpin.io" > Sculpin< / a > , < a href = "http://gulpjs.com" > Gulp< / a > and < a href = "http://behat.org" > Behat< / a > - each needing different arguments and options, depending on the command being run. For example, for Sculpin, I normally include several additional options when viewing the site locally - the full command that I use is < code > ./vendor/bin/sculpin generate --watch --server --clean --no-interaction< / code > . Typing this repeatedly is time consuming and could be easily mis-typed, forgotten or confused with other commands.< / p >
< p > In this video, I show you how I've simplied my Sculpin and Gulp workflow using custom Composer and NPM scripts.< / p >
< div class = "embed-container" >
< iframe width = "560" height = "315" src = "https://www.youtube.com/embed/eiWDV_63yCQ" frameborder = "0" allowfullscreen > < / iframe >
< / div >
< h2 id = "scripts" > Scripts< / h2 >
< p > Here are the scripts that I’ m using - they are slightly different from those in the video. I use the < code > --generate< / code > and < code > --watch< / code > options for Sculpin and the < code > gulp watch< / code > command for NPM. I had to change these before the recording as I was using the < a href = "https://github.com/paxtonhare/demo-magic" > demo magic< / a > script to run the commands, and existing from a watch session was also ending the script process.< / p >
< h3 id = "composer.json" > composer.json< / h3 >
< pre > < code class = "language-json" > "scripts": {
"clean": "rm -rf output_*/",
"dev": "sculpin generate --clean --no-interaction --server --watch",
"production": "sculpin generate --clean --no-interaction --env='prod' --quiet"
}
< / code > < / pre >
< p > Run with < code > composer run < name> < / code > , e.g. < code > composer run dev< / code > .< / p >
< h3 id = "package.json" > package.json< / h3 >
< pre > < code class = "language-json" > "scripts": {
"init": "yarn & & bower install",
"dev": "gulp watch",
"production": "gulp --production"
}
< / code > < / pre >
< p > Run with < code > npm run < name> < / code > , e.g. < code > npm run production< / code > .< / p >
< p > You can also take a look at the full < a href = "https://github.com/opdavies/oliverdavies.uk/blob/master/composer.json" > composer.json< / a > and < a href = "https://github.com/opdavies/oliverdavies.uk/blob/master/package.json" > package.json< / a > files within my site repository on < a href = "https://github.com/opdavies/oliverdavies.uk" > GitHub< / a > .< / p >
< h2 id = "resources" > Resources< / h2 >
< ul >
< li > < a href = "https://getcomposer.org/doc/04-schema.md#scripts" > Composer scripts< / a > < / li >
< li > < a href = "https://github.com/opdavies/oliverdavies.uk/blob/master/composer.json" > oliverdavies.uk composer.json< / a > < / li >
< li > < a href = "https://github.com/opdavies/oliverdavies.uk/blob/master/package.json" > oliverdavies.uk package.json< / a > < / li >
< / ul >
< p class = "tags" >
Tags:
2017-07-12 06:22:51 +00:00
< a href = "https://www.oliverdavies.uk/blog/tags/composer" > composer< / a > , < a href = "https://www.oliverdavies.uk/blog/tags/gulp" > gulp< / a > , < a href = "https://www.oliverdavies.uk/blog/tags/sculpin" > sculpin< / a > < / p >
2017-07-10 21:28:39 +00:00
< div class = "post-pager is-flex" >
< div class = "is-half" >
< a href = "/blog/2016/12/30/drupal-vm-generator-291-released" >
« Drupal VM Generator 2.9.1 Released
< / a >
< / div >
< div class = "is-half text-right" >
< a href = "/blog/2017/01/31/nginx-redirects-with-query-string-arguments" >
Nginx Redirects With Query String Arguments »
< / a >
< / div >
< / div >
< div class = "about-author" >
< h2 > About the Author< / h2 >
2017-07-12 06:24:51 +00:00
< img src = "//www.oliverdavies.uk/assets/images/me-precedent.jpg" alt = "Picture of Oliver" class = "img-circle" >
2017-07-10 21:28:39 +00:00
< p > Oliver Davies is a Web Developer, System Administrator and Drupal specialist based in the UK. He is a Senior Developer at < a href = "https://microserve.io" > Microserve< / a > and also provides freelance consultancy services for Drupal websites, PHP applications and Linux servers.< / p >
< / div >
< / main >
< div class = "col-md-3" >
< div class = "panel badges text-center" >
< a class = "badge--da-member" href = "https://assoc.drupal.org/membership" title = "I’ m a Drupal Association member." >
< img
2017-07-12 06:24:51 +00:00
src="//www.oliverdavies.uk/assets/images/da-individual-member.png"
2017-07-10 21:28:39 +00:00
alt="Drupal Association Individual Member"
width="152"
>
< / a >
< a href = "http://drupalcores.com/#opdavies" >
< img
alt="I built Drupal 8 with hand holding a wrench on blue background"
2017-07-12 06:24:51 +00:00
src="//www.oliverdavies.uk/assets/images/drupal-8.jpg"
2017-07-10 21:28:39 +00:00
/>
< / a >
< img
2017-07-12 06:24:51 +00:00
src="//www.oliverdavies.uk/assets/images/badges/acquia-certified-developer-drupal-8.png"
2017-07-10 21:28:39 +00:00
alt="Acquia Certified Developer - Drupal 8 Exam Badge"
height="147" width="147"
/>
< a href = "http://conference.phpnw.org.uk/phpnw17" >
2017-07-12 06:24:51 +00:00
< img src = "//www.oliverdavies.uk/assets/images/badges/phpnw17.png" alt = "" >
2017-07-10 21:28:39 +00:00
< / a >
< / div >
< div class = "availability panel panel-default" >
< div class = "panel-heading" > Availability< / div >
< div class = "panel-body" >
< p >
< i class = "fa fa-thumbs-o-up text-warning" > < / i >
Currently have limited part-time capacity
< / p >
< p >
< i class = "fa fa-thumbs-o-down text-danger" > < / i >
Currently no spare full-time capacity.
< / p >
< / div >
< / div >
< div class = "latest-posts panel panel-default" >
< div class = "latest-posts__heading panel-heading" > Latest blog posts< / div >
< ul class = "list-group" >
< li class = "post list-group-item" >
< span class = "post__title" >
< a href = "/blog/2017/06/09/introducing-the-drupal-meetups-twitterbot" >
Introducing the Drupal Meetups Twitterbot
< / a >
< / span > -
< span class = "post__date" > 9th June, 2017< / span >
< / li >
< li class = "post list-group-item" >
< span class = "post__title" >
< a href = "/blog/2017/05/20/turning-drupal-module-into-feature" >
Turning Your Custom Drupal Module into a Feature
< / a >
< / span > -
< span class = "post__date" > 20th May, 2017< / span >
< / li >
< li class = "post list-group-item" >
< span class = "post__title" >
< a href = "/blog/2017/05/15/drupalcamp-bristol-early-bird-tickets-sessions-sponsors" >
DrupalCamp Bristol 2017 - Early Bird Tickets, Call for Sessions, Sponsors
< / a >
< / span > -
< span class = "post__date" > 15th May, 2017< / span >
< / li >
< / ul >
< / div >
< / div >
< / div > < / div >
< footer class = "container" >
< p class = "copyright" >
© 2010-2017 Oliver Davies. Built with < a href = "https://sculpin.io" > Sculpin< / a > .
< / p >
< div class = "meetups" >
< h2 > Things that I organise< / h2 >
< ul >
< li class = "meetups--drupal-bristol" >
< a href = "http://www.drupalbristol.org.uk" title = "Drupal Bristol" >
2017-07-11 06:34:02 +00:00
< img
2017-07-12 06:24:51 +00:00
src="//www.oliverdavies.uk/assets/images/meetups/drupal-bristol.jpeg"
2017-07-11 06:34:02 +00:00
alt="Drupal Bristol logo"
>
2017-07-10 21:28:39 +00:00
< / a >
< / li >
< li class = "meetups--drupalcamp-bristol" >
< a href = "http://www.drupalcampbristol.co.uk" title = "DrupalCamp Bristol" >
2017-07-11 06:34:02 +00:00
< img
2017-07-12 06:24:51 +00:00
src="//www.oliverdavies.uk/assets/images/meetups/drupalcamp-bristol.png"
2017-07-11 06:34:02 +00:00
alt="DrupalCamp Bristol logo"
>
2017-07-10 21:28:39 +00:00
< / a >
< / li >
< li class = "meetups--phpsw" >
< a href = "http://phpsw.uk" title = "PHPSW" >
2017-07-11 06:34:02 +00:00
< img
2017-07-12 06:24:51 +00:00
src="//www.oliverdavies.uk/assets/images/meetups/phpsw.jpeg"
2017-07-11 06:34:02 +00:00
alt="PHPSW logo"
>
2017-07-10 21:28:39 +00:00
< / a >
< / li >
< / ul >
< / div >
< / footer >
2017-07-12 06:22:51 +00:00
< script src = "https://www.oliverdavies.uk/assets/js/site.js" > < / script >
2017-07-10 21:28:39 +00:00
< script > ( function ( i , s , o , g , r , a , m ) { i [ 'GoogleAnalyticsObject' ] = r ; i [ r ] = i [ r ] || function ( ) { ( i [ r ] . q = i [ r ] . q || [ ] ) . push ( arguments ) } , i [ r ] . l = 1 * new Date ( ) ; a = s . createElement ( o ) , m = s . getElementsByTagName ( o ) [ 0 ] ; a . async = 1 ; a . src = g ; m . parentNode . insertBefore ( a , m ) } ) ( window , document , 'script' , '//www.google-analytics.com/analytics.js' , 'ga' ) ; ga ( 'create' , 'UA-11967257-1' , 'auto' ) ; ga ( 'send' , 'pageview' ) ; < / script >
< / body >
< / html >