Vue.js : Mixed spaces and tabs (no-mixed-spaces-and-tabs)


Jika pernah mendapatkan error Mixed spaces and tabs (no-mixed-spaces-and-tabs) saat mengembangkan aplikasi dengan Vue.js, maka teman-teman bisa melakukan disable rule tersebut dari Eslint.

Sebenarnya Eslint digunakan agar penulisan kode yang kita buat menjadi lebih baik dan bagus, tapi jika teman-teman ingin menon-aktifkannya, maka bisa ikuti solusi berikut ini.

Terima Kasih.


Vue JS JavaScript
SOLUTIONS

Berikut ini adalah beberapa solusi yang mungkin bisa membantu kamu.


Silahkan teman-teman bisa menjalankan perintah berikut ini di dalam project Vue.js-nya.

npm remove @vue/cli-plugin-eslint

Atau teman-teman juga bisa mengikuti step-by-step cara berikut ini.

  1. Jalankan perintah berikut ini :

    npx eslint --init
    
  2. kemudian ada pilihan pertanyaan How would you like to use ESLint?, silahkan pilih To check syntax only. Kemudian klik ENTER.

  3. Setelah itu muncul pertanyaan lagi What type of modules does your project use?, pilih JavaScript modules (import/export). Kemudian ENTER.

  4. Dan ada pertanyaan lagi Which framework does your project use?, pilih Vue.js, kemudian ENTER.

  5. Muncul pertanyaan lagi Does your project use TypeScript?, silahkan pilih No dan ENTER.

  6. Pertanyaan lagi, Where does your code run?, silahkan pilih Browser dan ENTER.

  7. Pertanyaan terakhir What format do you want your config file to be in?. Silahkan pilih JavaScript dan ENTER.

Jika berhasil, maka kita akan mendapat 1 file baru dengan nama .eslintrc.js, kemudian buak file tersebut dan ubah kode-nya menjadi seperti berikut ini.

module.exports = {
    "env": {
        "browser": true,
        "es2021": true
    },
    "extends": "plugin:vue/essential",
    "parserOptions": {
        "ecmaVersion": 12,
        "sourceType": "module"
    },
    "plugins": [
        "vue"
    ],
    "rules": {
        "no-mixed-spaces-and-tabs": 0, // disable rule
    }
};

Di atas, kita menambahkan rules baru untuk menon-aktifkan mixed spaces and tabs. Silahkan restart project Vue.js kita dengan menekan tombol CTRL + C, kemudian jalankan lagi.

KEBIJAKAN KOMENTAR

Saat memberikan komenatar silahkan memberikan informasi lengkap tentang error, seperti: screenshot, link kode, dll. Baca aturan komentar kami