Bigcommerce Skeleton Theme
A stripped-down version of Bigcommerce's official Stencil theme. Very much a WIP (stands for 'work in progress').
Dependencies
stencil-cli
Development platform for stencil themes. Install this globally with NPM.
stencil-utils
Provides theme hooks and api calls for stencil themes. Added to themes with JSPM. Comes bundled with this skeleton.
bc-core
Shared templates for our stencil themes. Not bundled with this skeleton. Run the install script included in bc-core to add it to your theme.
Webpack
Webpack is now being used as our module bundler. It can be installed globally:
$ npm install -g webpack
Installation
npm install
Once the dependencies are installed, all you have to do is
stencil init
stencil start
Theme Directory Structure
SCSS
scss
|-- modules/
|-- general/
|-- pages/
+-- theme.scss
general/
All your global styles.
pages/
Page-specific: _home.scss
, _blog-post.scss
etc.
modules/
For overrides to any modules you may need. If you've got a carousel
module and you want different arrow colours or the like, drop a _carousel.scss
in here.
JS
js
|-- theme/
|-- app.js
+-- page-manager.js
...
Templates
templates
|-- components/
|-- layout/
+-- pages/
Notes
Quick Shop
When developing a quick shop, all the base functions you'll need reside within product-utils.js
—use these.