VSCode báo giá đơn đến kép tự động thay thế

Khi tôi thực hiện một Format Documentlệnh trên tệp Vue Component.vue VSCode thay thế tất cả chuỗi được trích dẫn đơn bằng chuỗi được trích dẫn kép.

Trong trường hợp cụ thể của tôi, quy tắc này xung đột với cấu hình electron-vue lint yêu cầu trích dẫn đơn.

Tôi chưa cài đặt các tiện ích mở rộng đẹp hơn (không có prettier.singleQuotetrong cài đặt của tôi)

Làm thế nào để tùy chỉnh VSCode để tránh điều này?

Tôi chưa prettiercài đặt tiện ích mở rộng, nhưng sau khi đọc câu trả lời có thể trùng lặp, tôi đã thêm từ đầu vào Cài đặt người dùng của mình ( UserSetting.json, Ctrl +, phím tắt):

"prettier.singleQuote": true

Một phần cảnh báo màu xanh lá cây ( Unknown configuration setting) các dấu nháy đơn không được thay thế nữa.

Tôi nghi ngờ rằng phần mở rộng đẹp hơn không hiển thị nhưng được nhúng bên trong phần mở rộng Vetur .

Vâng, giống như anh chàng (@ user2982122) đã đề cập nhưng thay vì Tệp, hãy chuyển đến Mã -> Tùy chọn -> Cài đặt, sau đó tìm Báo giá , chọn Prettier và chọn cả hai hộp

Đối với các dự án sử dụng .editorconfigtệp theo mặc định. Trình định dạng sẽ bỏ qua các quy tắc trong cài đặt và sử dụng các quy tắc trong .editorconfig, sau đó bạn có thể:

• Xóa .editorconfigtệp và sử dụng cài đặt VSCode của bạn.
• Thêm quote_type = singlevào .editorconfigtệp liên quan đến loại tệp của bạn. Bạn cũng có thể đặt quote_typegiá trị thành doublehoặc auto.

Có vẻ như đó là một lỗi mở cho vấn đề này: Lỗi Prettier

Không có giải pháp nào ở trên phù hợp với tôi. Điều duy nhất hoạt động là thêm dòng mã này vào package.json:

"prettier": {
    "singleQuote": true
  },

Từ trang vấn đề vuejs / vetur https://github.com/vuejs/vetur/issues/986# Giải pháp này phù hợp với tôi.

Trong settings.jsontệp VSCodes thêm mục này

"vetur.format.defaultFormatterOptions": {
    "prettier": {
        "singleQuote": true
    }
},

vui lòng xem xét .editorconfigghi đè mọi thứ, sử dụng:

[*]
quote_type = single

Giải pháp đúng:

Tôi thêm tệp .prettierrc.js vào dự án gốc chính của mình và viết

module.exports = {
    singleQuote: true
  };

Đối với người mới như tôi:

Từ menu Thanh điều hướng ở trên cùng: Chọn Tệp -> Tùy chọn -> Cài đặt. Trong hộp văn bản tìm kiếm, nhập Trích dẫn Trong danh sách được lọc xuất hiện bên dưới, hãy tìm biểu tượng bánh răng và bên cạnh biểu tượng đó - "Đẹp hơn". Nhấp vào hộp kiểm để bật "Prettier: Single Quote"

Cài đặt tiện ích mở rộng đẹp hơn và dán mã bên dưới vào settings.jsontệp VSCode của bạn

 "prettier.useEditorConfig": false,
 "prettier.singleQuote": true

điều này sẽ bỏ qua .editorconfigcài đặt tệp của bạn .

Theo ghi nhận của @attdona, phần mở rộng Vetur bao gồm đẹp hơn.

Mặc dù bạn có thể thay đổi cài đặt đẹp hơn, theo câu trả lời được chấp nhận, bạn cũng có thể thay đổi định dạng cho các vùng cụ thể của thành phần vue.

Ví dụ: ở đây, tôi đã đặt Vetur sử dụng trình định dạng vscode-typecript vì nó sử dụng dấu ngoặc kép theo mặc định:

Tôi đang sử dụng typecript, đối với tôi, nó đã được giải quyết bằng cách kiểm tra cờ "Tích hợp Tslint" trong cài đặt đẹp hơn (trong tùy chọn vscode):

Tôi đã gặp vấn đề tương tự trong vscode. Chỉ cần tạo tệp .prettierrc trong thư mục gốc của bạn và thêm json sau. Đối với các dấu ngoặc kép, hãy thêm:

{
  "singleQuote": true
}

Đối với dấu ngoặc kép, hãy thêm:

  {
      "singleQuote": false
  }

Hãy thử một trong những giải pháp này

1. Trong tệp vscode settings.json thêm mục này "prettier.singleQuote": true
2. Trong vscode nếu bạn có .editorconfigtệp, hãy thêm dòng này dưới biểu tượng [*] gốcquote_type = single
3. Trong vscode nếu bạn có .prettierrctệp, hãy thêm dòng này

{
    "singleQuote": true,
    "vetur.format.defaultFormatterOptions": {
        "prettier": {
            "singleQuote": true
        }
    }
}

Có giải pháp duy nhất phù hợp với tôi: và chỉ dành cho Dự án Angular:

Chỉ cần vào tệp ".editorconfig" của dự án và dán 'quote_type = single'. Hy vọng nó cũng sẽ làm việc cho bạn.

Tôi đã thêm tệp được gọi .prettierrcvào thư mục dự án của mình. Nội dung tệp:

{
    "singleQuote": true,
    "vetur.format.defaultFormatterOptions": {
        "prettier": {
            "singleQuote": true
        }
    }
}

Bạn có thể sử dụng điều này trong settings.json

"javascript.preferences.quoteStyle": "single"

Sử dụng phần mở rộng này.

https://marketplace.visualstudio.com/items?itemName=BriteSnow.vscode-toggle-quotes

cmd '(ctrl' trên win / Linux) sẽ xoay vòng giữa '"'

Nó hoạt động để tôi kiểm tra trích dẫn đơn lẻ trong Prettier cũng như tslint.autoFixOnSave là đúng

Để sử dụng JSX:

{"jsxSingleQuote": false}