A Yeoman generator that creates a simple starting point for a knockoutjs SPA.
This generator is a fork of the fantastic 'generator-ko' by the brilliant Steven Sanderson.
The purpose of this fork was to simplify the original project, reducing dependencies and avoiding any transpilation of javascript. What's left are only static files. The aim is to be a simple starting point for a knockoutjs single page application that works out of the box. Also trying to provide a tad more documentation, as the original project is best documented in this video
There is a minuscule underlying preference for users of the Brackets.io text editor, but it's absolutely not a dependency.
Since this is a Yeoman generator you will have to have installed node.js, which bundles npm.
And the Yeoman scaffolding tool. npm install -g yo
in node.
When that's all in place, you can install the generator npm install -g generator-classical-ko
Scaffolding a new app
Navigate your terminal to where you want to scaffold up your starting point. Should be an empty folder.
Type yo classical-ko
Yeoman will start up and ask you some questions:
- What's the name of your app
- Do you want to include automated tests? (Intern)
- What stylesheet language do you want to use? (Css or Less)
After that, you'll have a small simple app, as a starting point for your project.
Scaffolding new components
When you need a new component in your app you can scaffold one:
yo classical-ko:component <newComponentName>
This will add a component in src/components and register it in components.config.js
Scaffolding a new page
Almost the same as component
yo classical-ko:page <newComponentName>
This will add a page in src/pages and register it in components.config.js
Pages and components are essentially the same thing, but it's nice to have a logical separation in the folder tree.
Scaffolding a new binding
Bindigns are similar to components and pages
yo classical-ko:binding <newComponentName>
This will add a custom binding template in src/bindings and register it in require.config.js
If you go down the less-route, you can use the gulp watch
-task to transpile during development, or you can do it "manually" each time with gulp devLess
.
If you're using the Brackets.io text editor, I recommend the LESS AutoCompile extension. The style.less file has already been configured for this extension.
New in version 1.0.0 is the transition from Karma/Jasmine to the Intern. The intern is a complete framework for front-end application testing. Some gulp commands have been added for running the tests quickly:
gulp intern
- This runs the unit tests in the consolegulp intern-web
- This fires up the intern web-client (Beware of browser caching)gulp test
- A watch taks that runs the console client whenever source- or testcode changes. Protip: use--silent
to suppress all gulp info in the console, like so:gulp test --silent
MIT