0

Working on a shared project and my coworker created a new branch with an updated npm package (@mui/material from @material-ui/core). When I pull his branch and run npm install everything installs and works correctly. But now if I make a change to a file and then save (format on save is turned on), all my imports get formatted with value before them ex: import React from 'react' becomes import value React from 'react'. Not sure what to make of this because updating MUI shouldn't have changed anything related to formatting. He does not experience this problem.

We utilize ESLint v2.2.2 and Prettier - Code formatter v9.1.0 extensions in VS Code.

.eslintrc.json

  "env": {
    "browser": true,
    "es2020": true,
    "jest": true
  },
  "extends": ["eslint:recommended", "plugin:react/recommended", "react-app"],
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true
    },
    "ecmaVersion": 11,
    "sourceType": "module"
  },
  "plugins": ["react", "prettier"],
  "rules": {
    "react/prop-types": "off"
  }
}

.prettierrc

{
  "singleQuote": true
}

local settings

{
  "editor.formatOnSave": true,
  "eslint.format.enable": true,
  "javascript.updateImportsOnFileMove.enabled": "always",
  "terminal.integrated.tabs.enabled": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "workbench.startupEditor": "none",
  "git.confirmSync": false,
  "git.suggestSmartCommit": false,
  "typescript.updateImportsOnFileMove.enabled": "always"
}
adam.tarr57
  • 1
  • 1

1 Answers1

3

I had this same issue after updating some yarn package versions.

For me, simply quitting VS Code and launching it again solved the problem.

algoni
  • 645
  • 3
  • 8