Format with prettier

.pre-commit-config.yaml

@@ -1,4 +1,4 @@
-exclude: "{{cookiecutter.project_slug}}"
+exclude: '{{cookiecutter.project_slug}}'
 default_stages: [commit]
 
 repos:
@@ -18,10 +18,10 @@ repos:
       - id: detect-private-key
 
   - repo: https://github.com/pre-commit/mirrors-prettier
-    rev: "v3.0.0-alpha.6"
+    rev: 'v3.0.0-alpha.6'
     hooks:
       - id: prettier
-        args: ["--tab-width", "2"]
+        args: ['--tab-width', '2', '--single-quote']
 
   - repo: https://github.com/asottile/pyupgrade
     rev: v3.3.1

{{cookiecutter.project_slug}}/.pre-commit-config.yaml

@@ -1,4 +1,4 @@
-exclude: "^docs/|/migrations/"
+exclude: '^docs/|/migrations/'
 default_stages: [commit]
 
 repos:
@@ -44,7 +44,7 @@ repos:
     rev: 6.0.0
     hooks:
       - id: flake8
-        args: ["--config=setup.cfg"]
+        args: ['--config=setup.cfg']
         additional_dependencies: [flake8-isort]
 
 # sets up .pre-commit-ci.yaml to ensure pre-commit dependencies stay up to date

{{cookiecutter.project_slug}}/.readthedocs.yml

@@ -8,7 +8,7 @@ version: 2
 build:
   os: ubuntu-22.04
   tools:
-    python: "3.10"
+    python: '3.10'
 
 # Build documentation in the docs/ directory with Sphinx
 sphinx:

{{cookiecutter.project_slug}}/README.md

@@ -61,7 +61,7 @@ cd {{cookiecutter.project_slug}}
 celery -A config.celery_app worker -l info
 ```
 
-Please note: For Celery's import magic to work, it is important *where* the celery commands are run. If you are in the same folder with *manage.py*, you should be right.
+Please note: For Celery's import magic to work, it is important _where_ the celery commands are run. If you are in the same folder with _manage.py_, you should be right.
 
 To run [periodic tasks](https://docs.celeryq.dev/en/stable/userguide/periodic-tasks.html), you'll need to start the celery beat scheduler service. You can start it as a standalone process:
 

{{cookiecutter.project_slug}}/compose/production/traefik/traefik.yml

@@ -4,7 +4,7 @@ log:
 entryPoints:
   web:
     # http
-    address: ":80"
+    address: ':80'
     http:
       # https://docs.traefik.io/routing/entrypoints/#entrypoint
       redirections:
@@ -13,18 +13,18 @@ entryPoints:
 
   web-secure:
     # https
-    address: ":443"
+    address: ':443'
   {%- if cookiecutter.use_celery == 'y' %}
 
   flower:
-    address: ":5555"
+    address: ':5555'
   {%- endif %}
 
 certificatesResolvers:
   letsencrypt:
     # https://docs.traefik.io/master/https/acme/#lets-encrypt
     acme:
-      email: "{{ cookiecutter.email }}"
+      email: '{{ cookiecutter.email }}'
       storage: /etc/traefik/acme/acme.json
       # https://docs.traefik.io/master/https/acme/#httpchallenge
       httpChallenge:
@@ -34,9 +34,9 @@ http:
   routers:
     web-secure-router:
       {%- if cookiecutter.domain_name.count('.') == 1 %}
-      rule: "Host(`{{ cookiecutter.domain_name }}`) || Host(`www.{{ cookiecutter.domain_name }}`)"
+      rule: 'Host(`{{ cookiecutter.domain_name }}`) || Host(`www.{{ cookiecutter.domain_name }}`)'
       {%- else %}
-      rule: "Host(`{{ cookiecutter.domain_name }}`)"
+      rule: 'Host(`{{ cookiecutter.domain_name }}`)'
       {%- endif %}
       entryPoints:
         - web-secure
@@ -49,7 +49,7 @@ http:
     {%- if cookiecutter.use_celery == 'y' %}
 
     flower-secure-router:
-      rule: "Host(`{{ cookiecutter.domain_name }}`)"
+      rule: 'Host(`{{ cookiecutter.domain_name }}`)'
       entryPoints:
         - flower
       service: flower
@@ -61,9 +61,9 @@ http:
 
     web-media-router:
       {%- if cookiecutter.domain_name.count('.') == 1 %}
-      rule: "(Host(`{{ cookiecutter.domain_name }}`) || Host(`www.{{ cookiecutter.domain_name }}`)) && PathPrefix(`/media/`)"
+      rule: '(Host(`{{ cookiecutter.domain_name }}`) || Host(`www.{{ cookiecutter.domain_name }}`)) && PathPrefix(`/media/`)'
       {%- else %}
-      rule: "Host(`{{ cookiecutter.domain_name }}`) && PathPrefix(`/media/`)"
+      rule: 'Host(`{{ cookiecutter.domain_name }}`) && PathPrefix(`/media/`)'
       {%- endif %}
       entryPoints:
         - web-secure
@@ -79,7 +79,7 @@ http:
       # https://docs.traefik.io/master/middlewares/headers/#hostsproxyheaders
       # https://docs.djangoproject.com/en/dev/ref/csrf/#ajax
       headers:
-        hostsProxyHeaders: ["X-CSRFToken"]
+        hostsProxyHeaders: ['X-CSRFToken']
 
   services:
     django:

{{cookiecutter.project_slug}}/gulpfile.js

@@ -3,29 +3,29 @@
 ////////////////////////////////
 
 // Gulp and package
-const { src, dest, parallel, series, watch } = require('gulp')
+const { src, dest, parallel, series, watch } = require('gulp');
-const pjson = require('./package.json')
+const pjson = require('./package.json');
 
 // Plugins
-const autoprefixer = require('autoprefixer')
+const autoprefixer = require('autoprefixer');
-const browserSync = require('browser-sync').create()
+const browserSync = require('browser-sync').create();
-const concat = require('gulp-concat')
+const concat = require('gulp-concat');
 const tildeImporter = require('node-sass-tilde-importer');
-const cssnano = require ('cssnano')
+const cssnano = require('cssnano');
-const imagemin = require('gulp-imagemin')
+const imagemin = require('gulp-imagemin');
-const pixrem = require('pixrem')
+const pixrem = require('pixrem');
-const plumber = require('gulp-plumber')
+const plumber = require('gulp-plumber');
-const postcss = require('gulp-postcss')
+const postcss = require('gulp-postcss');
-const reload = browserSync.reload
+const reload = browserSync.reload;
-const rename = require('gulp-rename')
+const rename = require('gulp-rename');
-const sass = require('gulp-sass')(require('sass'))
+const sass = require('gulp-sass')(require('sass'));
-const spawn = require('child_process').spawn
+const spawn = require('child_process').spawn;
-const uglify = require('gulp-uglify-es').default
+const uglify = require('gulp-uglify-es').default;
 
 // Relative paths function
 function pathsConfig(appName) {
-  this.app = `./${pjson.name}`
+  this.app = `./${pjson.name}`;
-  const vendorsRoot = 'node_modules'
+  const vendorsRoot = 'node_modules';
 
   return {
     vendorsJs: [
@@ -39,10 +39,10 @@ function pathsConfig(appName) {
     fonts: `${this.app}/static/fonts`,
     images: `${this.app}/static/images`,
     js: `${this.app}/static/js`,
-  }
+  };
 }
 
-const paths = pathsConfig()
+const paths = pathsConfig();
 
 ////////////////////////////////
 // Tasks
@@ -53,25 +53,25 @@ function styles() {
   const processCss = [
     autoprefixer(), // adds vendor prefixes
     pixrem(), // add fallbacks for rem units
-  ]
+  ];
 
   const minifyCss = [
-      cssnano({ preset: 'default' })   // minify result
+    cssnano({ preset: 'default' }), // minify result
-  ]
+  ];
 
   return src(`${paths.sass}/project.scss`)
-    .pipe(sass({
+    .pipe(
+      sass({
         importer: tildeImporter,
-      includePaths: [
+        includePaths: [paths.sass],
-        paths.sass
+      }).on('error', sass.logError),
-      ]
+    )
-    }).on('error', sass.logError))
     .pipe(plumber()) // Checks for errors
     .pipe(postcss(processCss))
     .pipe(dest(paths.css))
     .pipe(rename({ suffix: '.min' }))
     .pipe(postcss(minifyCss)) // Minifies the result
-    .pipe(dest(paths.css))
+    .pipe(dest(paths.css));
 }
 
 // Javascript minification
@@ -80,7 +80,7 @@ function scripts() {
     .pipe(plumber()) // Checks for errors
     .pipe(uglify()) // Minifies the js
     .pipe(rename({ suffix: '.min' }))
-    .pipe(dest(paths.js))
+    .pipe(dest(paths.js));
 }
 
 // Vendor Javascript minification
@@ -91,46 +91,44 @@ function vendorScripts() {
     .pipe(plumber()) // Checks for errors
     .pipe(uglify()) // Minifies the js
     .pipe(rename({ suffix: '.min' }))
-    .pipe(dest(paths.js, { sourcemaps: '.' }))
+    .pipe(dest(paths.js, { sourcemaps: '.' }));
 }
 
 // Image compression
 function imgCompression() {
   return src(`${paths.images}/*`)
     .pipe(imagemin()) // Compresses PNG, JPEG, GIF and SVG images
-    .pipe(dest(paths.images))
+    .pipe(dest(paths.images));
 }
 
 {%- if cookiecutter.use_async == 'y' -%}
 // Run django server
 function asyncRunServer() {
-  const cmd = spawn('gunicorn', [
+  const cmd = spawn(
-      'config.asgi', '-k', 'uvicorn.workers.UvicornWorker', '--reload'
+    'gunicorn',
-      ], {stdio: 'inherit'}
+    ['config.asgi', '-k', 'uvicorn.workers.UvicornWorker', '--reload'],
-  )
+    {stdio: 'inherit'},
+  );
   cmd.on('close', function (code) {
-    console.log('gunicorn exited with code ' + code)
+    console.log('gunicorn exited with code ' + code);
   })
 }
 {%- else %}
 // Run django server
 function runServer(cb) {
-  const cmd = spawn('python', ['manage.py', 'runserver'], {stdio: 'inherit'})
+  const cmd = spawn('python', ['manage.py', 'runserver'], { stdio: 'inherit' });
   cmd.on('close', function (code) {
-    console.log('runServer exited with code ' + code)
+    console.log('runServer exited with code ' + code);
-    cb(code)
+    cb(code);
-  })
+  });
 }
 {%- endif %}
 
 // Browser sync server for live reload
 function initBrowserSync() {
   browserSync.init(
-    [
+    [`${paths.css}/*.css`, `${paths.js}/*.js`, `${paths.templates}/*.html`],
-      `${paths.css}/*.css`,
+    {
-      `${paths.js}/*.js`,
-      `${paths.templates}/*.html`
-    ], {
       {%- if cookiecutter.use_docker == 'y' %}
       // https://www.browsersync.io/docs/options/#option-open
       // Disable as it doesn't work from inside a container
@@ -145,43 +143,39 @@ function initBrowserSync() {
         {%- endif %}
         proxyReq: [
           function (proxyReq, req) {
-            // Assign proxy "host" header same as current request at Browsersync server
+            // Assign proxy 'host' header same as current request at Browsersync server
-            proxyReq.setHeader('Host', req.headers.host)
+            proxyReq.setHeader('Host', req.headers.host);
-          }
+          },
-        ]
+        ],
-      }
+      },
-    }
+    },
-  )
+  );
 }
 
 // Watch
 function watchPaths() {
-  watch(`${paths.sass}/*.scss`{% if cookiecutter.windows == 'y' %}, { usePolling: true }{% endif %}, styles)
+  watch(`${paths.sass}/*.scss`{% if cookiecutter.windows == 'y' %}, { usePolling: true }{% endif %}, styles);
-  watch(`${paths.templates}/**/*.html`{% if cookiecutter.windows == 'y' %}, { usePolling: true }{% endif %}).on("change", reload)
+  watch(`${paths.templates}/**/*.html`{% if cookiecutter.windows == 'y' %}, { usePolling: true }{% endif %}).on('change', reload);
-  watch([`${paths.js}/*.js`, `!${paths.js}/*.min.js`]{% if cookiecutter.windows == 'y' %}, { usePolling: true }{% endif %}, scripts).on("change", reload)
+  watch([`${paths.js}/*.js`, `!${paths.js}/*.min.js`]{% if cookiecutter.windows == 'y' %}, { usePolling: true }{% endif %}, scripts).on(
+    'change',
+    reload,
+  );
 }
 
 // Generate all assets
-const generateAssets = parallel(
+const generateAssets = parallel(styles, scripts, vendorScripts, imgCompression);
-  styles,
-  scripts,
-  vendorScripts,
-  imgCompression
-)
 
 // Set up dev environment
-const dev = parallel(
 {%- if cookiecutter.use_docker == 'n' %}
 {%- if cookiecutter.use_async == 'y' %}
-  asyncRunServer,
+const dev = parallel(asyncRunServer, initBrowserSync, watchPaths);
 {%- else %}
-  runServer,
+const dev = parallel(runServer, initBrowserSync, watchPaths);
 {%- endif %}
+{%- else %}
+const dev = parallel(initBrowserSync, watchPaths);
 {%- endif %}
-  initBrowserSync,
-  watchPaths
-)
 
-exports.default = series(generateAssets, dev)
+exports.default = series(generateAssets, dev);
-exports["generate-assets"] = generateAssets
+exports['generate-assets'] = generateAssets;
-exports["dev"] = dev
+exports['dev'] = dev;

{{cookiecutter.project_slug}}/local.yml

@@ -25,7 +25,7 @@ services:
       - ./.envs/.local/.django
       - ./.envs/.local/.postgres
     ports:
-      - "8000:8000"
+      - '8000:8000'
     command: /start
 
   postgres:
@@ -53,7 +53,7 @@ services:
       - ./config:/app/config:z
       - ./{{ cookiecutter.project_slug }}:/app/{{ cookiecutter.project_slug }}:z
     ports:
-      - "9000:9000"
+      - '9000:9000'
     command: /start-docs
   {%- if cookiecutter.use_mailhog == 'y' %}
 
@@ -101,7 +101,7 @@ services:
     image: {{ cookiecutter.project_slug }}_local_flower
     container_name: {{ cookiecutter.project_slug }}_local_flower
     ports:
-      - "5555:5555"
+      - '5555:5555'
     command: /start-flower
 
   {%- endif %}
@@ -121,10 +121,10 @@ services:
       - /app/node_modules
     command: npm run dev
     ports:
-      - "3000:3000"
+      - '3000:3000'
       {%- if cookiecutter.frontend_pipeline == 'Gulp' %}
       # Expose browsersync UI: https://www.browsersync.io/docs/options/#option-ui
-      - "3001:3001"
+      - '3001:3001'
       {%- endif %}
 
   {%- endif %}

{{cookiecutter.project_slug}}/production.yml

@@ -60,10 +60,10 @@ services:
     volumes:
       - production_traefik:/etc/traefik/acme
     ports:
-      - "0.0.0.0:80:80"
+      - '0.0.0.0:80:80'
-      - "0.0.0.0:443:443"
+      - '0.0.0.0:443:443'
       {%- if cookiecutter.use_celery == 'y' %}
-      - "0.0.0.0:5555:5555"
+      - '0.0.0.0:5555:5555'
       {%- endif %}
 
   redis:

{{cookiecutter.project_slug}}/webpack/common.config.js

@@ -3,20 +3,25 @@ const BundleTracker = require('webpack-bundle-tracker');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 
 module.exports = {
-  target: "web",
+  target: 'web',
   context: path.join(__dirname, '../'),
   entry: {
-    'project': path.resolve(__dirname, '../{{cookiecutter.project_slug}}/static/js/project'),
+    project: path.resolve(__dirname, '../{{cookiecutter.project_slug}}/static/js/project'),
-    'vendors': path.resolve(__dirname, '../{{cookiecutter.project_slug}}/static/js/vendors'),
+    vendors: path.resolve(__dirname, '../{{cookiecutter.project_slug}}/static/js/vendors'),
   },
   output: {
-    path: path.resolve(__dirname, '../{{cookiecutter.project_slug}}/static/webpack_bundles/'),
+    path: path.resolve(
+      __dirname,
+      '../{{cookiecutter.project_slug}}/static/webpack_bundles/',
+    ),
     publicPath: '/static/webpack_bundles/',
     filename: 'js/[name]-[fullhash].js',
     chunkFilename: 'js/[name]-[hash].js',
   },
   plugins: [
-    new BundleTracker({filename: path.resolve(__dirname, '../webpack-stats.json')}),
+    new BundleTracker({
+      filename: path.resolve(__dirname, '../webpack-stats.json'),
+    }),
     new MiniCssExtractPlugin({ filename: 'css/[name].[contenthash].css' }),
   ],
   module: {
@@ -35,11 +40,7 @@ module.exports = {
             loader: 'postcss-loader',
             options: {
               postcssOptions: {
-                plugins: [
+                plugins: ['postcss-preset-env', 'autoprefixer', 'pixrem'],
-                  'postcss-preset-env',
-                  'autoprefixer',
-                  'pixrem',
-                ],
               },
             },
           },

{{cookiecutter.project_slug}}/webpack/prod.config.js

@@ -5,8 +5,8 @@ const commonConfig = require('./common.config');
 {%- if cookiecutter.use_whitenoise == 'n' %}
 {%- if cookiecutter.cloud_provider == 'AWS' %}
 const s3BucketName = process.env.DJANGO_AWS_STORAGE_BUCKET_NAME;
-const awsS3Domain = process.env.DJANGO_AWS_S3_CUSTOM_DOMAIN ?
+const awsS3Domain = process.env.DJANGO_AWS_S3_CUSTOM_DOMAIN
-    process.env.DJANGO_AWS_S3_CUSTOM_DOMAIN
+  ? process.env.DJANGO_AWS_S3_CUSTOM_DOMAIN
   : `${s3BucketName}.s3.amazonaws.com`;
 const staticUrl = `https://${awsS3Domain}/static/`;
 {%- elif cookiecutter.cloud_provider == 'GCP' %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/static/js/project.js

@@ -1,5 +1,5 @@
-{%- if cookiecutter.frontend_pipeline == 'Webpack' %}
+{%- if cookiecutter.frontend_pipeline == 'Webpack' -%}
 import '../sass/project.scss';
-{%- endif %}
 
+{% endif -%}
 /* Project specific Javascript goes here. */

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/static/sass/project.scss

@@ -1,12 +1,11 @@
-@import "custom_bootstrap_vars";
+@import 'custom_bootstrap_vars';
-@import "~bootstrap/scss/bootstrap";
+@import '~bootstrap/scss/bootstrap';
-
 
 // project specific CSS goes here
 
-////////////////////////////////
+///////////////
 // Variables //
-////////////////////////////////
+///////////////
 
 // Alert colors
 
@@ -17,9 +16,9 @@ $pink: #f2dede;
 $dark-pink: #eed3d7;
 $red: #b94a48;
 
-////////////////////////////////
+////////////
 // Alerts //
-////////////////////////////////
+////////////
 
 // bootstrap alert CSS, translated to the django-standard levels of
 // debug, info, success, warning, error