ইমাসে জেএসএক্স (প্রতিক্রিয়া) ফাইলগুলি কীভাবে সম্পাদনা করবেন?

Question

আমি js2- মোড ব্যবহার করেছি তবে এটি জাভাস্ক্রিপ্টে html সঠিকভাবে ইনডেন্ট করে না। আমি এই রেপোটি https://github.com/jsx/jsx-mode.el খুঁজে পেয়েছি তবে এটি প্রতিক্রিয়া নয়, এটি অন্য কোনও জেএসএক্সের জন্য for

আপনি জেএসএক্স ফাইলগুলির সাথে প্রতিক্রিয়া প্রয়োগ করার জন্য কী ব্যবহার করবেন?

Answer 1

সমাধান 1:

পদক্ষেপ 1, https://github.com/felipeochoa/rjsx-mode ব্যবহার করুন

পদক্ষেপ 2, ইমাস 25+ ইনস্টল করুন, https://github.com/mooz/js2-mode/issues/291 দেখুন

পদক্ষেপ 3, নীচের কোড সহ প্যাচ rjsx- মোড

(defadvice js-jsx-indent-line (after js-jsx-indent-line-after-hack activate)
  "Workaround sgml-mode and follow airbnb component style."
  (save-excursion
    (beginning-of-line)
    (if (looking-at-p "^ +\/?> *$")
        (delete-char sgml-basic-offset))))

দয়া করে মনে রাখবেন যে আপনি যদি উপাদান সংখ্যায় তীর ফাংশনটি ব্যবহার করেন তবে কিছু ইনডেন্ট সমস্যা রয়েছে issue তবে এই সমাধান বেশিরভাগ ক্ষেত্রেই সূক্ষ্মভাবে কাজ করে।

প্যাচটি এখনও বর্তমান স্থিতিশীল সংস্করণের জন্য দরকারী rjsx-mode v0.4.0।

বাগ অস্থির সংস্করণে 2018-8-19 নিদৃষ্ট ছিলাম দেখুন https://github.com/felipeochoa/rjsx-mode/pull/75 বিস্তারিত জানার জন্য।

আমি আটকে থাকার কারণটি rjsx-modeহ'ল এটি জেএস 2-মোড থেকে উত্তরাধিকার সূত্রে আসে তাই আমি জেএস 2-মোড থেকে আইমনু ফাংশনগুলি ব্যবহার করতে পারি। এস 6 জাভাস্ক্রিপ্ট লেখার সময় এটি খুব দরকারী।

আপনি যদি এর js2-jsx-modeপরিবর্তে ব্যবহার করেন তবে দয়া করে নোট করুন rjsx-modeআপনার এখনও আমার প্যাচ দরকার।

সমাধান 2:

ওয়েব-মোড ব্যবহার করুন। আমি ওয়েব-মোড ব্যবহার করি না তবে এর সাম্প্রতিক প্রকাশিত নোট দাবি করে যে জেএসএক্স ইনডেন্টেশন সঠিকভাবে পরিচালনা করা যেতে পারে। আপনি যদি ওয়েব-মোড ব্যবহার করেন তবে js2- মোড থেকে আইমনু আর উপলভ্য নয়।

Comments

যে ওয়েব-মোড সমর্থন জেএসএক্স জানত না, আমি তখন এটি ব্যবহার করব, লেখক গিথুব সম্পর্কে সত্যিই প্রতিক্রিয়াশীল, যদি আপনি ইন্ডেন্টেশনে বাগগুলি খুঁজে পান।

— jcubic

আরজেএসএক্স-মোডে ইনডেন্টেশন সমস্যাটি স্থির হয়ে গেছে বলে মনে হচ্ছে!

— সিজিএল

আমার ফিক্স প্রয়োগের পরে এটি ঠিক হয়ে গেছে। আমি ইমা্যাকস 25.2 এবং 25.3 উভয়তেই আরজেএসএক্স-মোড ব্যবহার করি

— চেন বিন

প্যাচটি একটি ভাল ধারণা, আশা করি এটি ইতিমধ্যে আরজেএসএক্স মোডে মিশে গিয়েছিল!

— রুডল্ফ ওলা

প্যাচটি নতুন সংস্করণগুলির সাথে অপ্রয়োজনীয় হওয়ার বিষয়ে তথ্য যুক্ত করতে পারেন rjsx-modeবা এটি সম্পূর্ণরূপে অপসারণ করতে পারেন?

— DoMiNeLa10

Answer 2

ইম্যাক্স masterশাখায় (শেষ পর্যন্ত ইমাস 27), জেএসএক্স সমর্থনটি এখন ইম্যাক্সের জন্য ডিফল্ট জাভাস্ক্রিপ্ট মোডে নির্মিত js-mode। (এটি ব্যবহার করে দেখুন! আপনি উত্স থেকে তৈরি করতে পারেন বা পিপিএ থেকে একটি স্ন্যাপশট ইনস্টল করতে পারেন ))

যদি জেএসএক্সের ব্যবহার প্রত্যাশিত হয়, তবে জেএসএক্স সমর্থন জাভাস্ক্রিপ্ট বাফারগুলিতে স্বয়ংক্রিয়ভাবে সক্ষম হবে। ডিফল্ট মানদণ্ডগুলি হ'ল:

• ফাইলের নাম ".jsx" এ শেষ হয়, বা
• import React from 'react'অথবা var React = require('react')ফাইলের শীর্ষের কাছে উপস্থিত হয়

আপনি ভেরিয়েবলটিতে রিজেপস যুক্ত করে সনাক্তকরণ কৌশলটি কাস্টমাইজ করতে পারেন js-jsx-regexps। JSX নিঃশর্তভাবে সক্ষম করতে, আপনাকে সেট করতে পারে js-jsx-syntaxএকটি init ফাইলের / .dir-locals.el / ফাইল পরিবর্তনশীল, অথবা কলে টি js-jsx-enableমধ্যে js-mode-hook।

একবার সক্ষম হয়ে গেলে, জেএসএক্স হাইলাইট এবং সঠিকভাবে ইনডেন্ট করা হবে।

সংস্করণ 25-এর পর থেকে পাওয়া জেএসএক্স ইন্ডেন্টেশন সমর্থন নিয়ে হতাশ হওয়া ব্যবহারকারীরা আনন্দের সাথে অবাক হতে পারেন যে ইন্ডেন্টেশনটি আগের চেয়ে অনেক বেশি সঠিক। উদাহরণস্বরূপ, জেএসএক্সকে সঠিকভাবে ইনডেন্ট করার জন্য আর প্রথম বন্ধনে আবৃত হওয়া দরকার। তীর ফাংশন সহ ইনডেন্টিং কোডও এখন আরও ভাল কাজ করে।

Answer 3

আমি নিম্নলিখিত কনফিগারেশন সহ ওয়েব-মোড ব্যবহার করি :

(require 'web-mode)
(add-to-list 'auto-mode-alist '("\\.js\\'" . web-mode))
(add-to-list 'auto-mode-alist '("\\.html\\'" . web-mode))

;; (setq web-mode-enable-auto-pairing t)
(add-hook 'web-mode-hook
          (lambda ()
            ;; short circuit js mode and just do everything in jsx-mode
            (if (equal web-mode-content-type "javascript")
                (web-mode-set-content-type "jsx")
              (message "now set to: %s" web-mode-content-type))))

Comments

আপনার সমস্ত কনফিগারেশন জেএসএক্সের সাথে প্রাসঙ্গিক নয়।

— DoMiNeLa10

প্রকৃতপক্ষে, আমি যে ধারণা যাই হোক না কেন এটি কার্যকর হবে ছাপ অধীন ছিল। জেএসএক্সের সাথে সম্পর্কিত নয় এমন জিনিসগুলি সরিয়ে দিতে উত্তর সম্পাদনা করা হয়েছে।

— amirouche

Answer 4

আমি ওয়েব মোডও ব্যবহার করি এবং আপনি যদি ব্যবহার করেন তবে আপনি use-packageএই কোড স্নিপেট ব্যবহার করতে পারেন।

(use-package web-mode
  :defer 2
  :after (add-node-modules-path)
  :ensure t
  :mode ("\\.html?\\'"
         "/themes/.*\\.php?\\'"
         "/\\(components\\|containers\\|src\\)/.*\\.js[x]?\\'"
         "\\.\\(handlebars\\|hbs\\)\\'")
  :config (progn
            (setq
             web-mode-markup-indent-offset 2
             web-mode-css-indent-offset 2
             web-mode-code-indent-offset 2
             web-mode-enable-auto-closing t
             web-mode-enable-auto-opening t
             web-mode-enable-auto-pairing t
             web-mode-enable-auto-indentation t
             web-mode-enable-auto-quoting t
             web-mode-enable-current-column-highlight t
             web-mode-enable-current-element-highlight t
             web-mode-content-types-alist
             '(("jsx" . "/\\(components\\|containers\\|src\\)/.*\\.js[x]?\\'")))))

এটাও আপনার পাথ স্থানীয় নোড মডিউল যোগ করা যাতে আপনি ব্যবহার করতে পারেন eslintসঙ্গে flycheck। নোট করুন এটি ধরে নিয়েছে যে আপনি ম্যাকওএসে রয়েছেন, যার add-node-modules-pathএকই সমস্যাটি সমাধান করা দরকার। লিটিংয়ের কাজ করার জন্য আপনাকে ফ্লাইচেককে আলাদাভাবে কনফিগার করতে হবে।

আপনি যদি কেবল জেএসএক্স সম্পর্কিত জিনিস চান তবে আপনি এটি ব্যবহার করতে পারেন:

(use-package web-mode
  :ensure t
  :mode ("/\\(components\\|containers\\|src\\)/.*\\.js[x]?\\'")
  :config (progn
            (setq
             web-mode-content-types-alist
             '(("jsx" . "/\\(components\\|containers\\|src\\)/.*\\.js[x]?\\'")))))

এটি কেবল নাম components, containersবা সহ ফোল্ডারে ওয়েব মোড সক্ষম করবে src। আপনি যদি কোনও .js ফাইলে ওয়েব মোড সক্ষম করতে চান তবে সেই লাইনগুলি সরিয়ে দিন। আপনি যদি srcফোল্ডারগুলিতে ওয়েব-মোড সক্ষম করতে না চান তবে স্ট্রিংটিতে সেই লাইনটি অন :modeএবং উভয়ই সরিয়ে ফেলুন :config।