Integration of prettier with Intellij Idea and NPM - intellij-idea

Question

What I wanna achieve
Intellij - show error via red underline
Validate formating via NPM
Autoformating via save
Override printWidth to 140
Integrate with stylelint and tslint and file watcher
What I have done
stylelint.config.js
const regex = {
pascal: "[A-Z][a-z]+[a-zA-Z]*",
camel: "[a-z]+[a-zA-Z]*"
};
const componentElementModifier = `\\.${regex.pascal}(__${regex.camel}(_${regex.camel})?)?`;
const componentModifier = `\\.${regex.pascal}_${regex.camel}`;
const bemMix = `\\.${regex.pascal}__${regex.pascal}`;
module.exports = {
plugins: ["stylelint-prettier", "stylelint-selector-bem-pattern"],
extends: ["stylelint-prettier/recommended"],
rules: {
"prettier/prettier": true,
"plugin/selector-bem-pattern": {
componentName: regex.pascal,
implicitComponents: true,
componentSelectors: {
initial: `^(${componentElementModifier})$|^(${bemMix})$|^(${componentModifier})$`
}
}
}
};
tslint.json
{
"extends": [
"tslint:latest",
"tslint-react",
"tslint-plugin-prettier",
"tslint-config-prettier"
],
"rules": {
"object-literal-sort-keys": false,
"prettier": true,
"no-default-export": true
},
"linterOptions": {
"exclude": ["**/*.less.d.ts"]
}
}
Intellij Idea - File Watcher configuration
Intellij Idea - TSlint configuration
Intellij Idea - Typescript configuration
packge.json - stylelint config + runners
What my questions
How to add printWidth 140 to all configs?
How to share prittier config into tslint and stylelint?
How to make it works with runners in package.json and file watcher

Answer 1

How to add printWidth 140 to all configs?
I'd suggest setting it in your .prettierrc
How to share prittier config into tslint and stylelint?
tslint will use your prettier config for linting/autofixes if you configure it accordingly. Same is true for stylelint
How to make it works with runners in package.json and file watcher
not sure I follow you... I'd suggest removing Prettier file watcher and only use tslint and stylelint for formatting your code. You can configure them as file watchers if you like to fix code style issues on Save and/or add npm scripts to your package.json that would run tslint --fix and stylelint --fix commands