Skip to content
Permalink
Browse files

Final config

  • Loading branch information...
chrisdmacrae committed Jan 3, 2018
1 parent b63d4d9 commit 7db4ad209a3b9e3f629b9f3ed3bbdcf85d7f8740
File renamed without changes.
@@ -1,55 +1,35 @@
# Configures JS linting
# https://eslint.org/

# Add third-party configs
extends:
- eslint:recommended
- plugin:import/errors
- plugin:import/warnings

# Add third-party plugins
plugins:
- import
- compat

# Set target environment
env:
browser: true

# Add support for babel (ES6)
parser: babel-eslint

plugins: [ "import" ]

# enable ECMAScript features
ecmaFeatures:
arrowFunctions: true
binaryLiterals: true
blockBindings: true
classes: true
defaultParams: true
destructuring: true
forOf: true
generators: true
jsx: true
modules: true
objectLiteralShorthandMethods: true
objectLiteralShorthandProperties: true
octalLiterals: true
spread: true
templateStrings: true

rules:
# Possible Errors
# https://github.com/eslint/eslint/tree/master/docs/rules#possible-errors
no-control-regex: 2
no-console: 0
no-debugger: 2
no-dupe-args: 2
no-dupe-keys: 2
no-duplicate-case: 2
no-empty-character-class: 2
no-ex-assign: 2
no-extra-boolean-cast : 2
no-extra-semi: 2
no-invalid-regexp: 2
no-irregular-whitespace: 1
no-proto: 2
no-unexpected-multiline: 2
no-unreachable: 2
valid-typeof: 2

# Best Practices
# https://github.com/eslint/eslint/tree/master/docs/rules#best-practices
no-fallthrough: 2
no-redeclare: 2

# Browser compatibility
compat/compat: error

# Webpack import support
import/default: 0

# Stylistic Issues
# https://github.com/eslint/eslint/tree/master/docs/rules#stylistic-issues
@@ -65,7 +45,7 @@ rules:
no-trailing-spaces: 2
object-curly-spacing: [2, "never"]
quotes: [2, "double", "avoid-escape"]
semi: 0
semi: never
space-before-blocks: [2, "always"]
space-before-function-paren: [2, "never"]
space-in-parens: [2, "never"]
@@ -79,13 +59,6 @@ rules:
no-confusing-arrow: 2
prefer-const: 2

# JSX
jsx-quotes: [2, "prefer-double"]

# Import
import/no-unresolved: [1, {"commonjs": true, "amd": true}]
import/export: 2

# Strict Mode
# https://github.com/eslint/eslint/tree/master/docs/rules#strict-mode
strict: [2, "global"]
@@ -95,6 +68,9 @@ rules:
no-undef: 2
no-unused-vars: [2, {"args": "none"}]

# Browser compatibility
compat/compat: error

# Global scoped method and vars
globals:
__dirname: true
@@ -0,0 +1,21 @@
// Learn more about PostCSS:
// https://github.com/postcss/postcss

module.exports = function(ctx = {}) {
const file = ctx.file
const opts = ctx.options || {}
const isProduction = (opts.env === "production") || (process.env.NODE_ENV === "production")

return {
parser: "postcss-scss",
plugins: {
"precss": {},
"postcss-cssnext": {},
"cssnano": (isProduction) ? {autoprefixer: false} : false,
"laggard": {},
"postcss-reporter": {},
"postcss-browser-reporter": (isProduction) ? {} : false
}
}
}

@@ -1,19 +1,15 @@
# Configures CSS Linting
# https://stylelint.io/

extends: stylelint-config-standard
plugins: ["stylelint-scss"]
extends:
- stylelint-config-standard
- stylelint-config-sass-guidelines
plugins:
- stylelint-scss
- stylelint-no-unsupported-browser-features
defaultSeverity: warning
rules:
string-quotes: double
no-duplicate-selectors: true
color-hex-case: lower
color-hex-length: long
selector-attribute-quotes: always
declaration-colon-space-before: never
property-no-vendor-prefix: true
value-no-vendor-prefix: true
number-leading-zero: always
function-url-quotes: always
at-rule-no-vendor-prefix: true
selector-no-vendor-prefix: true
media-feature-name-no-vendor-prefix: true
plugin/no-unsupported-browser-features:
- true
- ignore: []
severity: warning
scss/at-extend-no-missing-placeholder: true
@@ -14,11 +14,11 @@ export default function(env) {
// Any third-party deps added via a <script> tag
// can be defined here so that they can be required
// in your application's JS files
// jquery: ["jQuery", "jquery", "$"]
// "jquery": "jQuery"
},
resolve: {
// Can be used to create aliases for imports
// modules: path.resolve(__dirname, 'src/js/example/utilities/')
// utilities: path.resolve(__dirname, 'src/js/example/utilities/')
// => import * from "utilities/filename"
},
module: {
@@ -65,7 +65,7 @@ npm run build
.
├── .tmp/ // Temporary directory for development server
├── dist/ // The production build
├── hugo/ // The Hugo project, with all content and static files
├── hugo/ // The Hugo project; content, data and static files
| ├── .forestry/ // Contains Forestry.io configuration files
| ├── content/ // Where all site content is stored
| ├── data/ // TOML, YAML or JSON files containing site data
@@ -79,23 +79,24 @@ npm run build
| | └── uploads/ // Where user uploads are stored
| └── config.toml // The Hugo configuration file
└─── src/
├── css // CSS source files to be compiled to /css/
├── scss // Sass source files to be compiled to /css/
├── css // CSS/SCSS source files to be compiled to /css/
├── js // JS source files to be compiled to /js/
└── img // Unoptimized raw image source files to be compiled to /img/
```

# Images
Images found in `src/img/` will be optimized and compressed and sent to `jekyll/img/` for usage in your layouts and content.
Images found in `src/img/` will be optimized and compressed and sent to `hugo/static/img/` for usage in your layouts & theme.

# Inline SVG
Any SVGs found in `src/img/` will be combined into a single SVG Sprite at `jekyll/partials/sprite.symbol.svg`
Any SVGs found in `src/img/` will be combined into a single SVG Sprite at `hugo/static/svg/sprite.symbol.svg`.

This can then be used in content or layouts as a Jekyll partial:
This boilerplate comes with a simple partial for using SVGs in your layouts. You can select an svg by passing in it's ID.

```
// todo
{{/* Using a logo stored at src/img/github.svg */}}
{{ partial "svg" (dict "id" "github" "class" "optional-class" "width" 32 "height" 32) -}}
```
**Note: the `class`, `width`, and `height` params are optional**

# Testing
This boilerplate comes with standard [ESLint](https://eslint.org/) and [StyleLint](https://github.com/stylelint/stylelint) configurations that will lint your CSS and JS for errors or common style issues, which work with most popular IDEs.
@@ -127,21 +128,22 @@ All build tasks are handled by Gulp and are located in `gulpfile.babel.js`. All
All build source and destination paths can be configured from `gulp.config.js`.

## Hugo
The build commands for Hugp can be configured from `gulp.config.js`. Build commands are set based on the `NODE_ENV` environment variable.
The build commands for Hugp can be configured from `gulp.config.js`. Build commands are set based on the `NODE_ENV` environment variable. You can optionally load different args using the `HUGO_ARGS` environment variable.

Four options are available:
- `default`: the default build commands that are always run
- `development`: additional build commands for the development server
- `production`: additional build commands for production builds and preview server
- `preview`: additional build commands for a production development server
- `production`: additional build commands for production builds

## BrowserSync Development Server
The configuration for BrowserSync is found in `browsersync.config.js`
The configuration for BrowserSync is found in `.browsersyncrc.js`

## CSS/SASS
The configuration for PostCSS is found in `postcss.config.js`
The configuration for PostCSS is found in `.postcssrc.js`

## Javascript
The configuration for Webpack is found in `webpack.config.js`
The configuration for Webpack is found in `.webpackrc.js`

## Browser support
Both PostCSS and Webpack use `.browserslistrc` to decide on browser support when compiling.
@@ -3,10 +3,10 @@
import {resolve} from "path"

export default function(env) {
const src = resolve(__dirname, "src/")
const dest = resolve(__dirname, "hugo/")
const tmp = resolve(__dirname, ".tmp/")
const build = resolve(__dirname, "dist/")
const src = "src/"
const dest = "hugo/"
const tmp = ".tmp/"
const build = "dist/"
const isProduction = process.env.NODE_ENV === "production"

return {
@@ -15,31 +15,35 @@ export default function(env) {
tmp: tmp,
build: build,
hugoArgs: {
default: ["-v", "--source", dest, "--destination", build],
default: ["-v", "--source", resolve(dest), "--destination", resolve(build)],
development: ["-b", "http://localhost:3000", "--buildDrafts", "--buildFuture", "--buildExpired"],
preview: ["-b", "http://localhost:3000"],
production: []
},
styles: {
src:
[
src + "/css/*.+(css|scss|sass)",
src + "/scss/*+(css|scss|sass)"
src + "css/*.+(css|scss|sass)",
src + "scss/*.+(css|scss|sass)"
],
dest: dest + "/static/css",
tmp: tmp + "/css"
watch:
[
src + "css/**/*.+(css|scss|sass)",
src + "scss/**/*.+(css|scss|sass)"
],
dest: dest + "static/css",
tmp: tmp + "css"
},
scripts: {
src: src + "/js/*+(js|jsx)",
dest: dest + "/static/js",
tmp: tmp + "/js"
},
images: {
src: src + "/img/**/*.+(png|jpg|jpeg|gif|svg|webp)",
dest: dest + "/static/img"
src: src + "js/*+(js|jsx)",
watch: src + "js/**/*+(js|jsx)",
dest: dest + "static/js/",
tmp: tmp + "js/"
},
svg: {
src: src + "/img/**/*.svg",
dest: dest + "/layouts/partials/svg",
src: src + "img/**/*.svg",
watch: src + "img/**/*.svg",
dest: dest + "static/svg/",
config: {
dest: ".",
mode: {

0 comments on commit 7db4ad2

Please sign in to comment.
You can’t perform that action at this time.