===== Combining Several Twine Stories Into One ===== If you're working on a longer work, you may find it easier to segment it into separate stories in Twine. This page explains how to merge them into one published file. ==== Setup ==== After the [[setting_up_a_project|usual project setup]], go to your project folder's top level in a terminal window. Then type: npm install --save grunt-contrib-copy grunt-contrib-watch Then press Enter to have npm install these packages for you. You'll also need to download the story format you plan on using. Follow the appropriate link and save it from your browser to a file named **format.js** in your **src** folder: * [[https://bitbucket.org/klembot/twinejs/raw/e473ee4d26cf5eac4b16f3a55ecc25c763a14092/story-formats/Harlowe/format.js?at=default|Harlowe]] * [[https://bitbucket.org/klembot/twinejs/raw/e473ee4d26cf5eac4b16f3a55ecc25c763a14092/story-formats/SugarCube/format.js?at=default|SugarCube]] * [[https://bitbucket.org/klembot/twinejs/raw/e473ee4d26cf5eac4b16f3a55ecc25c763a14092/story-formats/Snowman/format.js?at=default|Snowman]] ==== Gruntfile ==== Use this as a starting point: module.exports = function(grunt) { require('load-grunt-tasks')(grunt); grunt.initConfig({ copy: { fromTwine: { // These are the individual story files you want to combine. // This copies them to your src folder first, where entwine will then // do the work of creating a single story. src: [ '/Users/Me/Documents/Twine/Stories/My Story Part 1.html', '/Users/Me/Documents/Twine/Stories/My Story Part 2.html' ], dest: 'src/' } }, entwine: { default: { // You can change the name of the final story file by // changing my-story.html to something else. It should // always end in .html. You don't need to change the other // part of the line below; it will use all of the story files // that have been copied into your src folder by the copy task. files: { 'dist/my-story.html': ['src/*.html'] }, options: { // The location of the story format to use. You've already copied // it into place when you followed the instructions in Setup above. format: 'src/format.js', // The name you would like the final story to have. If it has apostrophes // in it, type \' instead, like so: 'I Didn\'t Eat The Plums' name: 'My Completed Story' } } }, watch: { twineEdits: { // This should match the files you have listed above, // under the fromTwine section. This watches for changes made // in Twine and copies them to your src folder. files: [ '/Users/Me/Documents/Twine/Stories/My Story Part 1.html', '/Users/Me/Documents/Twine/Stories/My Story Part 2.html' ], tasks: 'copy:fromTwine' }, twineFiles: { // This doesn't need to be customized. As files are copied // from Twine to src, the final story will be rebuilt. files: 'src/*.html', tasks: 'entwine' } } }); grunt.registerTask('default', ['copy', 'entwine']); }; As noted in the Gruntfile, you'll need to edit the file names to match the stories you have in Twine. ==== Using It ==== Type ''grunt'' and press Enter in your terminal window to build your story. It'll appear in your project's **dist** folder in a file named **my-story.html**, unless you changed that name in your Gruntfile. Typing ''grunt watch'' and pressing Enter in your terminal window will start Grunt watching your Twine stories for changes. As you edit in Twine, the files will be automatically copied to your **src** folder and the merged story will be rebuilt in **dist**. You can hide away the terminal window as you work. If you'd like the watch process to end, press Control-C in the terminal window. Windows will ask you if you're sure you want to quit this process; OS X and Linux will immediately quit it for you.