vue+eslint项目(项目已开发)使用prettier

1.开发环境 vue+eslint+prettier
2.电脑系统 windows10专业版
3.在使用vue+eslint项目开发的过程中,公司突然加需求使用prettier做代码的格式,怎么搞呢?下面我来分享一下。
4.废话不多说,直接上操作:

npm i [email protected] -D
npm i @vue/[email protected] -D
npm i [email protected] -D

5.在.eslintrc.js中修改代码如下:

// 原来配置
extends: [
    'plugin:vue/essential',
    '@vue/standard'
  ],

// 修改之后
extends: ["plugin:vue/essential", "@vue/standard", "@vue/prettier"],

6.在vue.config.js中添加如下代码:

module.exports = {
    chainWebpack: (config) => {
        // 开启eslint自动修复，关键代码
        config.module
            .rule('eslint')
            .use('eslint-loader')
            .loader('eslint-loader')
            .tap((options) => {
                options.fix = true
                return options
            })
    }
}

// 在保存的时候,会自动格式代码结构

7.本期的分享到了这里就结束啦,希望对你有所帮助,让我们一起努力走向巅峰。