之前使用 tslint 校验代码格式,后来发现 ts 官方已经放弃这个转而使用 eslint,研究了一下把相应配置调整了一下。
目标:
关于 1 做个简单说明,eslint、prettier 配合使用的方式是后者先按其规则格式化代码,然后使用 eslint --fix 再次格式化,从而达到代码兼容二者格式的目的。
npm i -D eslint prettier
npm i -D eslint-config-prettier eslint-plugin-prettier
npm i -D @typescript-eslint/eslint-plugin @typescript-eslint/parser
npm i -D husky lint-staged
npm i -D @commitlint/cli @commitlint/config-conventional
package.json 同级目录下配置如下文件
采用 .eslintrc.js(对于这些配置,优先选择 js 格式,不说别的,一个注释就比 json 格式强的多)。
module.exports = {
root: true,
parser: '@typescript-eslint/parser',
extends: [
'plugin:@typescript-eslint/recommended',
// Uses eslint-config-prettier to disable ESLint rules from @typescript-eslint/eslint-plugin that would conflict with prettier
'prettier/@typescript-eslint',
// Enables eslint-plugin-prettier and eslint-config-prettier. This will display prettier errors as ESLint errors. Make sure this is always the last configuration in the extends array.
// 此行必须在最后
'plugin:prettier/recommended',
],
env: {
es6: true,
node: true,
},
parserOptions: {
// 支持最新 JavaScript
ecmaVersion: 2018,
sourceType: 'module',
},
rules: {
// 如果有不适合的规则,可以在此调整
// ...
},
};
当然,上面是单纯的 node 下使用 TypeScript 的配置,如果是 react 之类的,可以再加上相应配置。
配置文件为:.prettierrc.js
module.exports = {
// 箭头函数只有一个参数的时候可以忽略括号
arrowParens: 'avoid',
// 括号内部不要出现空格
bracketSpacing: false,
// 行结束符使用 Unix 格式
endOfLine: 'lf',
// true: Put > on the last line instead of at a new line
jsxBracketSameLine: false,
// jsx 属性使用双引号
jsxSingleQuote: false,
// 行宽
printWidth: 100,
// 换行方式
proseWrap: 'preserve',
// 分号
semi: true,
// 使用单引号
singleQuote: true,
// 缩进
// tabWidth: 4,
// 使用空格缩进
useTabs: false,
// 后置逗号,多行对象、数组在最后一行增加逗号
trailingComma: 'es5',
// parser: 'babylon',
};
如果某些代码不需要格式化,可以在 .prettierignore 中配置,格式类似 .gitignore
module.exports = {
hooks: {
// git message 格式控制,参见下面的 git commit message 校验部分,如果不需要可删除
'commit-msg': 'commitlint -E HUSKY_GIT_PARAMS',
// commit 之前执行的命令
'pre-commit': 'lint-staged',
},
};
ts、js 之类代码使用 eslint 格式化,md、css 之类则用 prettier。
module.exports = {
linters: {
'*.{ts,tsx}': ['eslint --fix', 'git add'],
'*.{js,jsx}': ['eslint --fix', 'git add'],
'*.{md,html,json}': ['prettier --write', 'git add'],
'*.{css,scss,less}': ['prettier --write', 'git add'],
},
};
这个用来控制 git 提交信息是否符合规范,我一般使用 ,具体可参见说明。
简单来说,git 提交信息需符合如下规则:
type(scope?): subject
body?
footer?
.commitlintrc.js
此文件在 .huskyrc.js 中配置 commit-msg 后启用。
module.exports = {
extends: ['@commitlint/config-conventional'],
};
为方便检查代码格式是否存在错误,或者直接格式化所有代码,可以在 package.json 的 script 中配置如下命令:
"lint": "eslint 'src/**/*.{js,ts,tsx}'",
"format": "eslint --fix 'src/**/*.{js,ts,tsx}'",
前者用来检查代码是否存在格式问题。后者用来修正代码格式。
这篇文章将介绍通过原生js对时间进行格式转换的多种方法,支持任意顺序的日期格式排列。同时也将讲解如何实现显示几天前、几小时前或者几分钟前的方法。
WXS(WeiXin Script)是小程序的一套脚本语言,wxs 与 javascript 是不同的语言,有自己的语法,并不和 javascript 一致。其中包括了很多日常使用的javascript函数,在wxs中都是不能同样使用的。
公众号编辑器只是提供一些基础的功能,如果想让文章的排版比较个性化,就需要通过第三方编辑器。作为前端开发者,我们也可以选择自己修改样式。但是每次修改文章样式
获取当前时间;获取时间中的年月日时分秒;获取当前年份(2位);对Date的扩展,将 Date 转化为指定格式的String;月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符
将日期转换为指定的格式:比如转换成 年月日时分秒 这种格式:yyyy-MM-dd hh:mm:ss 或者 yyyy-MM-dd。当然是网上的方法,只是总结下。
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!