formidablelabs / spectacle-boilerplate Goto Github PK

[DEPRECATED] Boilerplate project for getting started with Spectacle Core

spectacle-boilerplate's Introduction

Spectacle Boilerplate

⚠️ Deprecated: This project has been deprecated. Please install spectacle-cli and use spectacle-boilerplate to generate your presentations with ease!

Generate a Spectacle presentation

First, install spectacle-cli:

$ npm install -g spectacle-cli

ℹ️ Note: If you would like to avoid a global install, you can use npx -p spectacle-cli spectacle-boilerplate in the place of the spectacle-boilerplate command below.

Then generate a new boilerplate Spectacle project!

$ spectacle-boilerplate

# ... or with options! ...
$ spectacle-boilerplate \
  --mode "js" \
  --name "deck-o-awesomeness" \
  --description "My fantastic Spectacle presentation" \
  --dir "PATH/TO/NEW/DECK/DIRECTORY"

# Check out the full usage
$ spectacle-boilerplate -h

Author and build your project!

See the boilerplate guide for full instructions. As a quick starter:

# Install your dependencies
$ yarn

# Start development server at localhost:8080
$ yarn start

# Create a production build for publishing
$ yarn build

spectacle-boilerplate's People

Contributors

Stargazers

Watchers

Forkers

threeve andreasloukakis hankmccoy toddmotto iamdustan pf-apaladino yonasberhe juristr capaj jojoee zregvart mactkg alanfoster heel nogsmpls robo-us wldcordeiro dominikmueller fbarrailla achristie yshayy agussman mikehedman rjanjic kwangkim nordstrand rgaidot hakimkal n3tr matt-gadd macncheeze ptahdunbar mbchoa jarlehansen anwaukoni gfargo austinlyon b3457m0d3 hackur huleg git-hub-clone pedrogk davesroka butter-ghee kevinsimper daz2345 francismurillo acateland oocta marufsiddiqui mikkom ryanlindsey markredeman qlaplanche fjsnogueira imkarma dlchen james-dowell bdougie ot-chris-reynolds spendesk brucelane matthias-reis housseindjirdeh samelliottdlt harendranathvegi9 scure21 amineafia wrple thmbois digitaldrummerj videodromm schoonology ryansn dschau hristo-tanev ronsuez pwmckenna g3org3 marcelcutts ursooperduper vmazur bspaulding vedranio jabher doug-wade simondegraeve minhhien1996 jamiebuilds thattobmate krule henriquechaves agarrharr hannahhoward alanraison knitcodemonkey mkhorton iamronsuez stmoreau mweststrate

spectacle-boilerplate's Issues

Does't not work out of the box

I did a git clone
yarn
yarn start

and get this error on `localhost:3000

TypeError: Cannot read property 'props' of undefined Manager._renderSlide webpack:///node_modules/spectacle/es/components/manager.js:752 Manager.render webpack:///node_modules/spectacle/es/components/manager.js:838 finishClassComponent webpack:///node_modules/react-dom/cjs/react-dom.development.js:10249 updateClassComponent webpack:///node_modules/react-dom/cjs/react-dom.development.js:10226 beginWork webpack:///node_modules/react-dom/cjs/react-dom.development.js:10605 performUnitOfWork webpack:///node_modules/react-dom/cjs/react-dom.development.js:12573 workLoop webpack:///node_modules/react-dom/cjs/react-dom.development.js:12682 HTMLUnknownElement.callCallback webpack:///node_modules/react-dom/cjs/react-dom.development.js:1299 Object.invokeGuardedCallbackDev webpack:///node_modules/react-dom/cjs/react-dom.development.js:1338 invokeGuardedCallback webpack:///node_modules/react-dom/cjs/react-dom.development.js:1195

On Ubuntu 18.04.1 LTS 64bit with Google Chrome Version 69.0.3497.100

What is the proper way to use flexbox to get a multi-column silde with mdx?

Rename or remove autoprefixer-core

autoprefixer-core was renamed to autoprefixer and old npm package was deprecated.

I tried to make a PR, but I didn’t find how you use autoprefixer-core.

npm start fail (windows)

npm install => now ok (thanks)
npm start + open http://localhost:3000 => BAD

λ npm start

> [email protected] start C:\ami44\spectacle-boilerplate
> node server.js

Listening at http://localhost:3000
webpack built 5d0d130e5f9c1afd80f6 in 4221ms
Hash: 5d0d130e5f9c1afd80f6
Version: webpack 1.12.10
Time: 4221ms
        Asset     Size  Chunks       Chunk Names
    bundle.js  3.52 MB       0       main
bundle.js.map  3.89 MB       0       main
chunk    {0} bundle.js, bundle.js.map (main) 3.41 MB [rendered]
    [0] multi main 40 bytes {0} [built]
.....
  [386] ./assets/markdown.png 3.02 kB {0} [built]
  [387] ./~/raw-loader!./assets/deck.example 897 bytes {0} [built]

ERROR in ./~/spectacle/~/history/lib/createBrowserHistory.js
Module not found: Error: Cannot resolve module 'invariant' in C:\ami44\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/createBrowserHistory.js 9:17-37

ERROR in ./~/spectacle/~/history/lib/createHashHistory.js
Module not found: Error: Cannot resolve module 'invariant' in C:\ami44\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/createHashHistory.js 13:17-37

ERROR in ./~/spectacle/~/history/lib/createHashHistory.js
Module not found: Error: Cannot resolve module 'warning' in C:\ami44\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/createHashHistory.js 9:15-33

ERROR in ./~/spectacle/~/history/lib/createDOMHistory.js
Module not found: Error: Cannot resolve module 'invariant' in C:\ami44\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/createDOMHistory.js 9:17-37

ERROR in ./~/spectacle/~/history/lib/DOMStateStorage.js
Module not found: Error: Cannot resolve module 'warning' in C:\ami44\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/DOMStateStorage.js 10:15-33

ERROR in ./~/spectacle/~/history/lib/createHistory.js
Module not found: Error: Cannot resolve module 'deep-equal' in C:\ami44\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/createHistory.js 9:17-38

ERROR in ./~/spectacle/~/history/lib/runTransitionHook.js
Module not found: Error: Cannot resolve module 'warning' in C:\ami44\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/runTransitionHook.js 7:15-33

ERROR in ./~/spectacle/~/history/lib/deprecate.js
Module not found: Error: Cannot resolve module 'warning' in C:\ami44\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/deprecate.js 7:15-33

ERROR in ./~/spectacle/~/history/lib/parsePath.js
Module not found: Error: Cannot resolve module 'warning' in C:\ami44\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/parsePath.js 7:15-33

Thanks

Loading mp4 video in to `video` tag w/ File loader

I added:

{
  test: /\.mp4$/,
  loader: 'file'
}

to my webpack config. Then I required my mp4 video file. Used it like so:

            <video controls>
              <source src={videos.brian} />
            </video>

(I also tried with <video src= /> that did not work). What happens is I see 2 requests being made:

I believe this is a configuration issue with webpack. Perhaps a serving issue with server.js. I can use youtube to host the video, but I was hoping to have a little more control over the video style. Any help would be appreciated or more information that you need from me.

I understand that this is not an issue w/ the boilerplate itself, but I didn't know of a better place to put it.

Missing loader for example code

This repo includes a piece of example code, assets/deck.example, and the tutorial provides instructions for including it in the presentation by adding the code

const code = {
  deckSample: require('../assets/deck.example')
};

and the slide

<Slide>
  <ComponentPlayground code={code.deckSample} theme={dark} />
</Slide>

However, doing so yields an error:

ERROR in ./assets/deck.example 1:0
Module parse failed: 'return' outside of function (1:0)
You may need an appropriate loader to handle this file type.
> return (
|   <Deck transition={['zoom','slide']} transitionDuration={800}>
|     <Slide bgColor="primary">
 @ ./presentation/index.js 41:14-47
 @ ./index.js
 @ multi @babel/polyfill webpack-hot-middleware/client react-hot-loader/patch ./index

I was able to get the example code displayed by updating the Webpack config to use the raw loader for .example files:

{
  test: /\.example$/i,
  use: 'raw-loader',
},

Presentation Mode doesn't work

As per FormidableLabs/spectacle#436, presentation mode doesn't work when using this boilerplate. The solution that worked for me is mentioned in a comment under that issue.

Just changing the spectacle version to ^4.0.4 solved it. I wouldn't mind changing that in a PR 😄

npm run build fails

Windows 10

npm run build

> [email protected] build C:\Users\Sebastian\Projekte\spectacle-boilerplate
> cross-env NODE_ENV=production webpack --config webpack.config.production.js

Hash: 37d99ec1faeab81185db
Version: webpack 1.13.1
Time: 53524ms
                               Asset     Size  Chunks             Chunk Names
1d90323a86770f1c08933398caa3d50f.jpg  1.02 MB          [emitted]  
95649f398587a84a7e69e0493c83e88e.png   122 kB          [emitted]  
                           bundle.js   617 kB       0  [emitted]  main
   [0] multi main 40 bytes {0} [built]
    + 664 hidden modules

ERROR in ./~/spectacle/~/history/lib/createBrowserHistory.js
Module not found: Error: Cannot resolve module 'invariant' in C:\Users\Sebastian\Projekte\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/createBrowserHistory.js 9:17-37

ERROR in ./~/spectacle/~/history/lib/createHashHistory.js
Module not found: Error: Cannot resolve module 'invariant' in C:\Users\Sebastian\Projekte\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/createHashHistory.js 13:17-37

ERROR in ./~/spectacle/~/history/lib/createHashHistory.js
Module not found: Error: Cannot resolve module 'warning' in C:\Users\Sebastian\Projekte\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/createHashHistory.js 9:15-33

ERROR in ./~/spectacle/~/history/lib/DOMStateStorage.js
Module not found: Error: Cannot resolve module 'warning' in C:\Users\Sebastian\Projekte\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/DOMStateStorage.js 10:15-33

ERROR in ./~/spectacle/~/history/lib/createDOMHistory.js
Module not found: Error: Cannot resolve module 'invariant' in C:\Users\Sebastian\Projekte\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/createDOMHistory.js 9:17-37

ERROR in ./~/spectacle/~/history/lib/createHistory.js
Module not found: Error: Cannot resolve module 'deep-equal' in C:\Users\Sebastian\Projekte\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/createHistory.js 9:17-38

ERROR in ./~/spectacle/~/history/lib/runTransitionHook.js
Module not found: Error: Cannot resolve module 'warning' in C:\Users\Sebastian\Projekte\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/runTransitionHook.js 7:15-33

ERROR in ./~/spectacle/~/history/lib/deprecate.js
Module not found: Error: Cannot resolve module 'warning' in C:\Users\Sebastian\Projekte\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/deprecate.js 7:15-33

ERROR in ./~/spectacle/~/history/lib/parsePath.js
Module not found: Error: Cannot resolve module 'warning' in C:\Users\Sebastian\Projekte\spectacle-boilerplate\node_modules\spectacle\node_modules\history\lib
 @ ./~/spectacle/~/history/lib/parsePath.js 7:15-33

How to add favicon to the web page ?

Hey there, i'm new with react js and starting with this example. So what i want i s to add a simple icon beside the web page title and i couldn't change it !. does anyone know how to change it ??

simple two columns, full height slide

Hello!

I'm sorry if this is obvious, but is there an easy way to create a slide that has two full-height columns that take up the entire width (each 50% of the screen)?

Thank you!

Is it possible to prevent going to the next slide

In this use case there should be an option to prevent going to the next slide. If I use something like this

<Slide goTo={9}> <Slide8 /> </Slide>

It still goes to the next slide. Is there a way to prevent going to the next slide?

I'm using the Boilerplate and I also just got the vulnerability warning regarding chjj / marked package

I am using the Spectacle Boilerplate for one of my projects here on Github https://github.com/interglobalmedia/evolution-in-design-and-development, and I just received the following warning:

We found potential security vulnerabilities in your dependencies.
Some of the dependencies defined in your package-lock.json have known security vulnerabilities and should be updated.

Review vulnerable dependencies

And in my Dependency graph:

 Dependencies defined in package-lock.json 797

470564?s=20&v=4
chjj / marked

Won't run. SyntaxError Unexpected token

I downloaded it, ran npm i, and npm start. This is the output:

ERROR in ./index.js
Module build failed: SyntaxError: Unexpected token (6:7)

  4 | import Presentation from "./presentation";
  5 |
> 6 | render(<Presentation/>, document.getElementById("root"));
    |        ^
  7 |

 @ multi webpack-hot-middleware/client babel-polyfill ./index

Spectacle core API link in README returns 404

https://github.com/FormidableLabs/spectacle/blob/master/README.markdown
that the README links to is now https://github.com/FormidableLabs/spectacle/blob/master/README.md
Fixed in PR: #53

npm install fail (windows)

(windows) npm instal return error

npm ERR! peerinvalid The package [email protected] does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer [email protected] wants history@^1.17.0

full log

λ npm install
npm WARN package.json [email protected] No repository field.
npm WARN optional dep failed, continuing [email protected]
npm WARN optional dep failed, continuing [email protected]
npm WARN peerDependencies The peer dependency history@^1.17.0 included from react-router will no
npm WARN peerDependencies longer be automatically installed to fulfill the peerDependency
npm WARN peerDependencies in npm 3+. Your application will need to depend on it explicitly.
npm WARN optional dep failed, continuing [email protected]

> [email protected] postinstall C:\ami44\spectacle-boilerplate\node_modules\spectacle\node_modules\react-router
> node ./npm-scripts/postinstall.js

/
> [email protected] postinstall C:\ami44\spectacle-boilerplate\node_modules\spectacle\node_modules\radium\node_modules\inline-style-prefixer\node_modules\caniuse-api
> node generator.js

caniuse-api: Generation ok

> [email protected] postinstall C:\ami44\spectacle-boilerplate\node_modules\spectacle\node_modules\radium
> node -e "require('fs').stat('lib', function(e,s){process.exit(e || !s.isDirectory() ? 1 : 0)})" || npm run lib

npm ERR! Windows_NT 6.1.7601
npm ERR! argv "D:\\Nodist\\bin\\v-x64\\nodev4.2.2\\node.exe" "D:\\Nodist\\bin\\node_modules\\npm\\bin\\npm-cli.js" "install"
npm ERR! node v4.2.2
npm ERR! npm  v2.14.10
npm ERR! code EPEERINVALID

npm ERR! peerinvalid The package [email protected] does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer [email protected] wants history@^1.17.0

npm ERR! Please include the following file with any support request:
npm ERR!     C:\ami44\spectacle-boilerplate\npm-debug.log

Unable to configure port

Sometimes you are running an example application whilst showing a presentation, unfortunately both may bind to port 3000 by default.

We should allow the boilerplate example to accept a configurable port -

PORT=3000 npm run start

ansi-to-html-umd is required

Just downloaded & got an error from Webpack trying to require the module.

I'm assuming a PR would be kosher?

Updating Spectacle boilerplate in existing project

Question

Hi there! First of all, thanks for all the effort in creating Spectacle and this boilerplate. It's a great way to create presentations and has inspired a number of great followup libraries too!

The issue that I currently have is that I would like to update an existing project with the new dependencies and updates that have been made to the boilerplate (I'm doing this to fix security issues in webpack-dev-server as explained in yarnpkg/yarn#6909).

I would like to apply all changes since I first cloned the boilerplate. Unfortunately, I removed all git history from the boilerplate, so pulling from upstream will probably not work.

Background Info/Attempts

I could just try applying the patch for the one change that I really want (#68), but this may not work in case other files have been updated before that change...

I could also just re-clone the boilerplate and then copy over my presentation files and fix any problems, but this would lose my git history.

If there is no recommended way for doing this, I suppose I will just try to apply the changes from the boilerplate manually.

doesn't work with updated dependencies

I cloned the repo, updated the dependencies and the deck won't run.

"dependencies": {
    "normalize.css": "5.0.0",
    "react": "15.2.1",
    "react-dom": "15.2.1",
    "spectacle": "1.0.0"
  },
  "devDependencies": {
    "autoprefixer-core": "6.0.1",
    "babel-core": "6.4.0",
    "babel-eslint": "7.0.0",
    "babel-loader": "6.2.1",
    "babel-plugin-react-transform": "2.0.2",
    "babel-polyfill": "6.3.14",
    "babel-preset-es2015": "6.3.13",
    "babel-preset-react": "6.3.13",
    "babel-preset-react-hmre": "1.0.1",
    "babel-preset-stage-0": "6.3.13",
    "cross-env": "3.1.3",
    "css-loader": "0.25.0",
    "eslint": "3.8.1",
    "eslint-config-defaults": "9.0.0",
    "eslint-plugin-filenames": "1.1.0",
    "eslint-plugin-react": "6.4.1",
    "express": "4.13.3",
    "file-loader": "0.9.0",
    "html-loader": "0.4.0",
    "is-buffer": "1.1.1",
    "markdown-loader": "0.1.7",
    "node-libs-browser": "1.0.0",
    "raw-loader": "0.5.1",
    "react-transform-hmr": "1.0.4",
    "rimraf": "2.4.4",
    "style-loader": "0.13.0",
    "surge": "latest",
    "url-loader": "0.5.6",
    "webpack": "1.12.8",
    "webpack-dev-middleware": "1.2.0",
    "webpack-hot-middleware": "2.5.0"
  }

yarn install issue

Exit code: 128

Failed to download Chromium r508693! Set "PUPPETEER_SKIP_CHROMIUM_DOWNLOAD" env variable to skip download.

RROR: Failed to download Chromium r508693! Set "PUPPETEER_SKIP_CHROMIUM_DOWNLOAD" env variable to skip download.
{ Error: connect ETIMEDOUT 119.28.102.126:443
at Object._errnoException (util.js:1022:11)
at _exceptionWithHostPort (util.js:1044:20)
at TCPConnectWrap.afterConnect [as oncomplete] (net.js:1198:14)
code: 'ETIMEDOUT',
errno: 'ETIMEDOUT',
syscall: 'connect',
address: '119.28.102.126',
port: 443 }
npm WARN [email protected] No repository field.

Eslint the node-only files.

Maybe want to split eslints to react and node.

`npm install` fails

Hey guys, wonderful looking library - really excited to get it running.

Sadly though npm install seems to fail here. The log is below

> [email protected] postinstall <path snipped>/node_modules/radium
> cd lib || npm run lib

sh: line 0: cd: lib: No such file or directory

> [email protected] lib <path snipped>/node_modules/radium
> npm run babel && rimraf lib/__tests__ lib/__mocks__


> [email protected] babel <path snipped>/node_modules/radium
> rimraf lib && babel src/ -d lib/

sh: babel: command not found

npm ERR! Darwin 15.4.0
npm ERR! argv "/usr/local/Cellar/nvm/0.23.3/versions/node/v5.10.1/bin/node" "/usr/local/Cellar/nvm/0.23.3/versions/node/v5.10.1/bin/npm" "run" "babel"
npm ERR! node v5.10.1
npm ERR! npm  v3.8.3
npm ERR! file sh
npm ERR! code ELIFECYCLE
npm ERR! errno ENOENT
npm ERR! syscall spawn
npm ERR! [email protected] babel: `rimraf lib && babel src/ -d lib/`
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the [email protected] babel script 'rimraf lib && babel src/ -d lib/'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the radium package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     rimraf lib && babel src/ -d lib/
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs radium
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls radium
npm ERR! There is likely additional logging output above.
npm WARN Local package.json exists, but node_modules missing, did you mean to install?

npm ERR! Please include the following file with any support request:
npm ERR!     <path snipped>/node_modules/radium/npm-debug.log

npm ERR! Darwin 15.4.0
npm ERR! argv "/usr/local/Cellar/nvm/0.23.3/versions/node/v5.10.1/bin/node" "/usr/local/Cellar/nvm/0.23.3/versions/node/v5.10.1/bin/npm" "run" "lib"
npm ERR! node v5.10.1
npm ERR! npm  v3.8.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] lib: `npm run babel && rimraf lib/__tests__ lib/__mocks__`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] lib script 'npm run babel && rimraf lib/__tests__ lib/__mocks__'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the radium package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     npm run babel && rimraf lib/__tests__ lib/__mocks__
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs radium
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls radium
npm ERR! There is likely additional logging output above.
npm WARN Local package.json exists, but node_modules missing, did you mean to install?

npm ERR! Please include the following file with any support request:
npm ERR!     <path snipped>/node_modules/radium/npm-debug.log
npm WARN [email protected] No repository field.
npm ERR! Darwin 15.4.0
npm ERR! argv "/usr/local/Cellar/nvm/0.23.3/versions/node/v5.10.1/bin/node" "/usr/local/opt/nvm/versions/node/v5.10.1/bin/npm" "install"
npm ERR! node v5.10.1
npm ERR! npm  v3.8.3
npm ERR! code ELIFECYCLE

npm ERR! [email protected] postinstall: `cd lib || npm run lib`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] postinstall script 'cd lib || npm run lib'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the radium package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     cd lib || npm run lib
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs radium
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls radium
npm ERR! There is likely additional logging output above.

Radium appears to have been removed from node_modules which may simply be part of the general npm lifecycle.

The same occurs with a plain install of Spectacle.

Using the latest Node (5.10.1) and npm (3.8.7).

Thanks a lot.

How do I download the boilerplate?

How do I download the boilerplate? You probably mean I should clone this repo. But you could also utilize github releases and point visitors there.

`npm run build` fails on npm v2

Works fine on npmv3, but:

$ npm install
$ npm run build

On npmv 2 yields:

$ npm run build

> [email protected] build /Users/rroemer/scm/fmd/builder-decks
> webpack --config webpack.config.dev.js

Hash: a868f206d3f2f91fbe56
Version: webpack 1.12.11
Time: 4215ms
   [0] multi main 40 bytes {0} [built]
    + 387 hidden modules

ERROR in ./~/spectacle/~/history/lib/createBrowserHistory.js
Module not found: Error: Cannot resolve module 'invariant' in /Users/rroemer/scm/fmd/builder-decks/node_modules/spectacle/node_modules/history/lib
 @ ./~/spectacle/~/history/lib/createBrowserHistory.js 9:17-37

ERROR in ./~/spectacle/~/history/lib/createHashHistory.js
Module not found: Error: Cannot resolve module 'invariant' in /Users/rroemer/scm/fmd/builder-decks/node_modules/spectacle/node_modules/history/lib
 @ ./~/spectacle/~/history/lib/createHashHistory.js 13:17-37

ERROR in ./~/spectacle/~/history/lib/createHashHistory.js
Module not found: Error: Cannot resolve module 'warning' in /Users/rroemer/scm/fmd/builder-decks/node_modules/spectacle/node_modules/history/lib
 @ ./~/spectacle/~/history/lib/createHashHistory.js 9:15-33

ERROR in ./~/spectacle/~/history/lib/DOMStateStorage.js
Module not found: Error: Cannot resolve module 'warning' in /Users/rroemer/scm/fmd/builder-decks/node_modules/spectacle/node_modules/history/lib
 @ ./~/spectacle/~/history/lib/DOMStateStorage.js 10:15-33

ERROR in ./~/spectacle/~/history/lib/createDOMHistory.js
Module not found: Error: Cannot resolve module 'invariant' in /Users/rroemer/scm/fmd/builder-decks/node_modules/spectacle/node_modules/history/lib
 @ ./~/spectacle/~/history/lib/createDOMHistory.js 9:17-37

ERROR in ./~/spectacle/~/history/lib/createHistory.js
Module not found: Error: Cannot resolve module 'deep-equal' in /Users/rroemer/scm/fmd/builder-decks/node_modules/spectacle/node_modules/history/lib
 @ ./~/spectacle/~/history/lib/createHistory.js 9:17-38

ERROR in ./~/spectacle/~/history/lib/runTransitionHook.js
Module not found: Error: Cannot resolve module 'warning' in /Users/rroemer/scm/fmd/builder-decks/node_modules/spectacle/node_modules/history/lib
 @ ./~/spectacle/~/history/lib/runTransitionHook.js 7:15-33

ERROR in ./~/spectacle/~/history/lib/deprecate.js
Module not found: Error: Cannot resolve module 'warning' in /Users/rroemer/scm/fmd/builder-decks/node_modules/spectacle/node_modules/history/lib
 @ ./~/spectacle/~/history/lib/deprecate.js 7:15-33

ERROR in ./~/spectacle/~/history/lib/parsePath.js
Module not found: Error: Cannot resolve module 'warning' in /Users/rroemer/scm/fmd/builder-decks/node_modules/spectacle/node_modules/history/lib
 @ ./~/spectacle/~/history/lib/parsePath.js 7:15-33

Recommend use of degit?

In the README, we suggest cloning the repository and removing the .git folder. Rich Harris just released a tool, degit, that seems to do just that. If we believe recommending degit will make adoption easier, let's update the README.

If this is something we want, I'm happy to pull together a commit.

colSpan and rowSpan on spectacle table component

I cannot seem to use colSpan or rowSpan attributes with the table components provided by spectacle. Should I use regular html table tags, or is there a way to pass these to the spectacle table components?

yarn start after cloning the repo fails

Clean spectacle-boilerplate fails after running yarn start.

Steps for reproduce the issue:

git clone [email protected]:FormidableLabs/spectacle-boilerplate.git
cd spectacle-boilerplate
yarn install

yarn install v1.13.0
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
error An unexpected error occurred: "/Users/user/Library/Caches/Yarn/v4/npm-fast-deep-equal-2.0.1-7b05218ddf9667bf7f370bf7fdb2cb15fdd0aa49/node_modules/fast-deep-equal/.yarn-metadata.json: Unexpected end of JSON input".
info If you think this is a bug, please open a bug report with the information provided in "/Users/Vadim/Development/Qlean/spectacle-boilerplate/yarn-error.log".
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.

yarn start

> [email protected] clean /Users/user/Development/spectacle-boilerplate
> rimraf dist

sh: rimraf: command not found

Also can't be used with npm install && npm run build, but packages installation doesn't have an errors:

git clone [email protected]:FormidableLabs/spectacle-boilerplate.git
cd spectacle-boilerplate
npm install
...
npm run build

ERROR in bundle.js from UglifyJs
Unexpected token: keyword (const) [bundle.js:21453,0]

Can't traverse using the CodeSlide extension with arrow keys.

Hi, I'm unable to traverse the CodeSlide extension with the arrow keys. Is there something that I'm missing? I'm using the spectacle mdx boilerplate.

import CodeSlide from 'spectacle-code-slide';

---
<CodeSlide transition={[]}
            lang="python"
            code={require("raw-loader!../assets/code.py")}
            ranges={[
              { loc: [0, 1], title: "Finally, some code" },
              { loc: [1, 3], title: "The Beginning" },
              { loc: [3, 5] },
              { loc: [1, 2], note: "Heres a note!" },
              { loc: [2, 3] },
              { loc: [4, 7] },
              ]}/>
---

It compiles and the slide is shown but none of the traversing functionality seems to work.

gh-pages (github pages)

What is the idiomatic way of uploading a presentation to github pages?
I've tried to target master/docs (after changing the build of course) but it seems that gh-pages doesn't respect relative path for resources?

I managed to do it a while back but it stopped working, and not sure what is actually the correct way of doing it.

I'm curious if there's a "formal" deploy process for spectacle-boilerplate to gh-pages.

CSS is not loaded through css-loader in dev mode

The dev webpack config is using the raw loader for CSS. This means that fonts / images are not resolved and served by webpack. Interestingly the production build is using the css-loader.

I am working with css which is loading fonts (font-awesome). Changing the raw loader to css loader ensures that the fonts are loaded properly.

I don't have time for a PR. So I'm just leaving this here.

CodePane run error

When use CodePane there is a error:

TypeError: Cannot read property 'buildPlaceholders' of undefined
http://localhost:3050/dist/bundle.js:58448:40
Object.run
webpack:///node_modules/prismjs/components/prism-core.js:451
highlight
webpack:///node_modules/prismjs/components/prism-core.js:280
prism
webpack:///node_modules/react-live/dist/react-live.es.js:23
Editor.componentWillMount
webpack:///node_modules/react-live/dist/react-live.es.js:393
callComponentWillMount
webpack:///node_modules/react-dom/cjs/react-dom.development.js:6872
mountClassInstance
webpack:///node_modules/react-dom/cjs/react-dom.development.js:6968
updateClassComponent
webpack:///node_modules/react-dom/cjs/react-dom.development.js:8337
beginWork
webpack:///node_modules/react-dom/cjs/react-dom.development.js:8982
performUnitOfWork
webpack:///node_modules/react-dom/cjs/react-dom.development.js:11814

Some images are not properly loaded in production mode

I observed that some ressources are not properly loaded (happens also on my own fork of the boilerplate). In dev mode (when running yarn start it works perfectly.

How to reproduce:

$ git clone ...
$ yarn install
$ yarn build
open index.html go slide 8

You'll see that some logo just don't appear. If I'm not mistaking, the npm logo should appear on the right of SendGrid's one.

I use:

node v8.3.0 (it also happened on a 7.X version)
yarn v0.23.2
Chrome 60.0.3112.90
macOS 10.12.6 (Sierra), MacBook Prop (Early 2015)

I don't think I have anything really specific about my machine, or my configuration.

build script error from Uglify - `Unexpected token: keyword (const)`

running npm run build was throwing the following error:

ERROR in bundle.js from UglifyJs
Unexpected token: keyword (const) [bundle.js:6,144411]

I fixed it as described in this stackoverflow answer by replacing uglify with the terser webpack plugin

I'd be happy to put in a PR so others don't run into this issue if you'd like?

SeattleJS deck mistakenly committed?

The latest commit appears to have been mistakenly committed to this repo, as it removed the sample deck that was there before.

npm start fails

When I run npm start i get the following error

ERROR in ./index.js
Module build failed: ReferenceError: 
Unknown plugin "react-transform" specified in "base.env.development" at 0...

Upgrade to babel-preset-env

Request for README enhancement for Windows developers

For windows, removing .git folder requires running rmdir as shown below.

rmdir /S .git

Would you be able to make a change to the README file?
or even better, I'd love to create a PR for the README file update.