diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 00000000..beb9bc70 --- /dev/null +++ b/.prettierignore @@ -0,0 +1,9 @@ +*.html +*.css +*.scss +*.js +*.yml +*.yaml +# Actually check these files +!static-src/client.js +!webpack.config.js diff --git a/package-lock.json b/package-lock.json index 8375674d..93d0f6b2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -5207,6 +5207,12 @@ "integrity": "sha1-1PRWKwzjaW5BrFLQ4ALlemNdxtw=", "dev": true }, + "prettier": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.0.5.tgz", + "integrity": "sha512-7PtVymN48hGcO4fGjybyBSIWDsLU4H4XlvOHfq91pz9kkGlonzwTfYkaIEwiRg/dAJF9YlbsduBAgtYLi+8cFg==", + "dev": true + }, "process": { "version": "0.11.10", "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz", diff --git a/package.json b/package.json index eabda7fe..5b7814ad 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,9 @@ "build": "webpack --config webpack.config.js --mode=development --progress --colors", "watch": "webpack --config webpack.config.js --mode=development --watch", "dist": "webpack --config webpack.config.js --mode=production --progress --colors", - "deploy": "npm run dist && gh-pages -d www" + "deploy": "npm run dist && gh-pages -d www", + "lint": "prettier -c .", + "format": "prettier --write ." }, "repository": { "type": "git", @@ -32,6 +34,7 @@ "mini-css-extract-plugin": "^0.8.0", "node-sass": "^4.12.0", "optimize-css-assets-webpack-plugin": "^5.0.3", + "prettier": "^2.0.5", "sass-loader": "^7.3.1", "style-loader": "^1.0.0", "webpack": "^4.39.2", diff --git a/webpack.config.js b/webpack.config.js index 8fdd819b..daee20df 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -1,55 +1,52 @@ -const webpack = require('webpack'); -const path = require('path'); +const webpack = require("webpack"); +const path = require("path"); -const MiniCssExtractPlugin = require('mini-css-extract-plugin'); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin"); -const TerserPlugin = require('terser-webpack-plugin'); +const TerserPlugin = require("terser-webpack-plugin"); module.exports = { - entry: './static-src/index.js', + entry: "./static-src/index.js", output: { - path: path.resolve(__dirname, './www/bundle'), - filename: 'bundle.js' + path: path.resolve(__dirname, "./www/bundle"), + filename: "bundle.js", }, module: { - rules: [{ + rules: [ + { test: /\.scss$/, - use: [ - MiniCssExtractPlugin.loader, - 'css-loader', - 'sass-loader' - ] - }, { - // the file-loader emits files directly to OUTPUT_DIR/fonts - test: /\.(woff(2)?|ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, - loader: 'file-loader?name=./fonts/[name].[ext]', - }, { - // Image loader - // the file-loader emits files directly to OUTPUT_DIR/img - test: /\.(png|gif|jpg|jpeg)$/, - loaders: ['file-loader?name=./img/[name].[ext]'] - }] + use: [MiniCssExtractPlugin.loader, "css-loader", "sass-loader"], + }, + { + // the file-loader emits files directly to OUTPUT_DIR/fonts + test: /\.(woff(2)?|ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, + loader: "file-loader?name=./fonts/[name].[ext]", + }, + { + // Image loader + // the file-loader emits files directly to OUTPUT_DIR/img + test: /\.(png|gif|jpg|jpeg)$/, + loaders: ["file-loader?name=./img/[name].[ext]"], + }, + ], }, optimization: { - minimizer: [ - new TerserPlugin(), - new OptimizeCSSAssetsPlugin({}) - ] + minimizer: [new TerserPlugin(), new OptimizeCSSAssetsPlugin({})], }, plugins: [ new MiniCssExtractPlugin({ // Options similar to the same options in webpackOptions.output - filename: '[name].css', - path: path.resolve(__dirname, './www/bundle'), - chunkFilename: '[id].css' + filename: "[name].css", + path: path.resolve(__dirname, "./www/bundle"), + chunkFilename: "[id].css", }), // Makes jQuery (required for bootstrap4) available to other JS includes // https://webpack.js.org/plugins/provide-plugin/ new webpack.ProvidePlugin({ - $: 'jquery', - jQuery: 'jquery', - 'window.jQuery': 'jquery' + $: "jquery", + jQuery: "jquery", + "window.jQuery": "jquery", }), - ] + ], };