269 lines
13 KiB
HTML
269 lines
13 KiB
HTML
|
<!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">
|
|||
|
|
|||
|
|
|||
|
<meta property="og:url" content="https://www.oliverdavies.uk/blog/2017/01/07/easier-sculpin-commands-with-composer-and-npm-scripts">
|
|||
|
<meta property="og:title" content="Easier Sculpin Commands with Composer and NPM Scripts"/>
|
|||
|
|
|||
|
|
|||
|
|
|||
|
<meta property="og:image" content="https://www.oliverdavies.uk/assets/images/me-precedent.jpg"/>
|
|||
|
<meta property="og:image:height" content="327"/>
|
|||
|
<meta property="og:image:type" content="image/jpg">
|
|||
|
<meta property="og:image:width" content="327"/>
|
|||
|
|
|||
|
|
|||
|
|
|||
|
<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">
|
|||
|
|
|||
|
<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>
|
|||
|
<a class="navbar-brand" href="https://www.oliverdavies.uk/">Oliver Davies</a>
|
|||
|
</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>
|
|||
|
|
|||
|
<p class="posted">7th January 2017</p>
|
|||
|
|
|||
|
<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:
|
|||
|
<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>
|
|||
|
<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>
|
|||
|
|
|||
|
<img src="//images.oliverdavies.uk/assets/images/me-precedent.jpg" alt="Picture of Oliver" class="img-circle">
|
|||
|
|
|||
|
<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
|
|||
|
src="//images.oliverdavies.uk/assets/images/da-individual-member.png"
|
|||
|
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"
|
|||
|
src="//images.oliverdavies.uk/assets/images/drupal-8.jpg"
|
|||
|
/>
|
|||
|
</a>
|
|||
|
|
|||
|
<img
|
|||
|
src="//images.oliverdavies.uk/assets/images/badges/acquia-certified-developer-drupal-8.png"
|
|||
|
alt="Acquia Certified Developer - Drupal 8 Exam Badge"
|
|||
|
height="147" width="147"
|
|||
|
/>
|
|||
|
|
|||
|
<a href="http://conference.phpnw.org.uk/phpnw17">
|
|||
|
<img src="//images.oliverdavies.uk/assets/images/badges/phpnw17.png" alt="">
|
|||
|
</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">
|
|||
|
<img src="//images.oliverdavies.uk/assets/images/meetups/drupal-bristol.jpeg" alt="Drupal Bristol">
|
|||
|
</a>
|
|||
|
</li>
|
|||
|
<li class="meetups--drupalcamp-bristol">
|
|||
|
<a href="http://www.drupalcampbristol.co.uk" title="DrupalCamp Bristol">
|
|||
|
<img src="//images.oliverdavies.uk/assets/images/meetups/drupalcamp-bristol.png" alt="DrupalCamp Bristol">
|
|||
|
</a>
|
|||
|
</li>
|
|||
|
<li class="meetups--phpsw">
|
|||
|
<a href="http://phpsw.uk" title="PHPSW">
|
|||
|
<img src="//images.oliverdavies.uk/assets/images/meetups/phpsw.jpeg" alt="PHPSW">
|
|||
|
</a>
|
|||
|
</li>
|
|||
|
</ul>
|
|||
|
</div>
|
|||
|
</footer>
|
|||
|
|
|||
|
<script src="https://www.oliverdavies.uk/assets/js/site.js"></script>
|
|||
|
|
|||
|
<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>
|