parallax-common-config
v0.11.2
Published
This is a module with all parallax-common-config configurations for team-parallax.
Downloads
17
Maintainers
Readme
parallax-common-config
This is a module with all parallax-common-config configurations for team-parallax.
Note
This is a module with opinionated configurations you might find useful. This is used internally at team-parallax.
Installation
yarn add -D parallax-common-config
Additional dependencies are required for eslint, webpack to run smoothly:
yarn add -D @typescript-eslint/eslint-plugin @typescript-eslint/parser autoprefixer awesome-typescript-loader cache-loader css-loader css-modules-typescript-loader eslint-config-react-app eslint-loader eslint-plugin-filenames eslint-plugin-sort-keys-fix eslint-plugin-import-alias eslint-plugin-jsdoc eslint-plugin-react eslint-plugin-sort-imports-es6-autofix eslint-plugin-unused-imports extract-css-chunks-webpack-plugin file-loader html-webpack-plugin style-loader svg-inline-loader typescript typescript-eslint-parser typings-for-css-modules-loader url-loader webpack-merge eslint-plugin-import
Usage
.editorconfig
Create a symlink to use our .editorconfig
ln -s node_modules/parallax-common-config/.editorconfig .editorconfig
.gitlab-ci.common.yml
Create a symlink to use our .gitlab-ci.common.yml
ln -s node_modules/parallax-common-config/.gitlab-ci.common.yml .gitlab-ci.common.yml
.browserlistrc
Create a symlink to use our .editorconfig
ln -s node_modules/parallax-common-config/.browserlistrc .browserlistrc
.eslintrc
Add this to your .eslintrc
{
"extends": [
"./node_modules/parallax-common-config/.eslintrc",
"./node_modules/parallax-common-config/.eslintrc.react",
"./node_modules/parallax-common-config/.eslintrc.typescript"
]
}
Note that there are also .eslintrc.prod
files which return errors instead of warnings. This is useful for CI
pipelines - use them like so
{
"extends": [
"./node_modules/parallax-common-config/.eslintrc",
"./node_modules/parallax-common-config/.eslintrc.react",
"./node_modules/parallax-common-config/.eslintrc.prod",
"./node_modules/parallax-common-config/.eslintrc.react.prod",
"./node_modules/parallax-common-config/.eslintrc.typescript" // TODO: create a prod-version of this one
]
}
tsconfig
{
"extends": "./node_modules/parallax-common-config/tsconfig.react"
}
Webpack
We utilize webpack-merge
in order to modularize our webpack configurations.
const webpack = require("webpack");
const merge = require("webpack-merge");
const path = require("path");
const webpackDev = require("./node_modules/parallax-common-config/webpack.config.dev");
const webpackProd = require("./node_modules/parallax-common-config/webpack.config.prod");
const webpackCommon = require("./node_modules/parallax-common-config/webpack.config.common");
const webpackReact = require("./node_modules/parallax-common-config/webpack.config.react");
module.exports = (env, argv) => {
const dev = argv.mode === "development";
return merge(webpackCommon, webpackReact, dev
? webpackDev({})
: webpackProd({}), {
plugins: [
new webpack.EnvironmentPlugin({
MODE: dev
? "development"
: "production"
})
],
resolve: {
alias: {
"~": path.resolve(__dirname, "src/"),
Api: path.resolve(__dirname, "src/api/"),
Components: path.resolve(__dirname, "src/components/"),
Models: path.resolve(__dirname, "src/models/"),
Services: path.resolve(__dirname, "src/services/"),
Stores: path.resolve(__dirname, "src/stores/"),
Views: path.resolve(__dirname, "src/views/")
}
}
});
};
TODOs
- Change installation section to make installation more atomic.
- Create a postcss configuration
- Link and configure jest
- Automate installation with a script (cli)
- add husky configuration
- add lint-staged configuration
- add credentials check (sonar lint/git-secrets)
- add https://github.com/dylang/npm-check
- add commit linting (https://www.npmjs.com/package/check-commit ?)