【技術實現步驟摘要】
本專利技術代碼開發領域，尤其涉及一種提高自定義代碼編輯器開發效率的方法。
技術介紹
1、前端主流的編輯器插件主要有codemirror,monaco?editor等，無論使用那種插件都需要配置外觀，支持語言及一系列輔助參數。前端開發過程中遇到需要用戶寫代碼的需求時，目前大多數的解決方案都是利用開源的編輯器進行二次開發，在開發過程首先需要閱讀官方api文檔，再根據文檔在代碼中進行一系列復雜的配置及業務開發，如果想實現更復雜的功能，那么學習和開發成本則更高一些。
2、現有技術僅解決了用戶使用編輯器的基本需求，更多場景下需要更友好的代碼聯想提示、語法校驗，錯誤提示等并未能很好地進行支持，而且開發人員需要花費一定的學習成本來進行代碼開發。
技術實現思路
1、本專利技術的目的在于，針對解決編輯器自定義開發學習成本高和開發難度較大，及無法智能提示錯誤信息的技術問題，提出一種提高自定義代碼編輯器開發效率的方法。
2、一種提高自定義代碼編輯器開發效率的方法，步驟為：
3、s1：前期工作：安裝依賴包、創建文件結構；
4、s2：實現過程：引入編輯器并配置組件功能；
5、s3：使用過程：開發人員導入組件，根據業務傳入屬性。
6、進一步的，一種提高自定義代碼編輯器開發效率的方法，所述步驟s1還包括以下子步驟：
7、s11：在開發項目工程下安裝codemirror6插件的依賴包；
8、s12：在項目路徑下創建相關
9、進一步的，一種提高自定義代碼編輯器開發效率的方法，所述相關文件路徑結構包括codemirror目錄、components目錄、hinttooltip目錄、utils目錄、index.tsx文件、interface.ts文件；
10、所述codemirror目錄下實現編輯器的核心功能，包括各種配置及自定義擴展；
11、所述components目錄下解決方案需要的其他組件；
12、所述hinttooltip目錄下提示框彈窗組件；
13、所述utils目錄下解決方案用到的所有通用方法；
14、所述index.tsx文件為組件的入口文件，是向外導出共開發人員使用的組件；
15、所述nterface.ts文件定義解決方案組件的參數。
16、進一步的，一種提高自定義代碼編輯器開發效率的方法，所述步驟s2還包括以下子步驟：
17、s21：在index.tsx文件中引入兩個codemirror目錄下的組件，一個作為正常編輯器，一個作為內置的放大編輯器；
18、s22：在codemirror目錄下根據方法文檔配置編輯器的各種擴展方法；
19、s23：在編輯器中通過nterface.ts文件讀取參數設置編輯器代碼類型；
20、所述代碼類型包括表達式、方法；
21、s24：設置用戶語言類型，支持的語言包括javascript、java、sql、html；
22、s25：在hinttooltip目錄下提示用戶輸入的內容是否正確；
23、s26：引入nterface.ts文件，自定義提示補全代碼，hinttooltip目錄下顯示提示備注；
24、s27：對外提供可操作編輯器的方法；
25、s28：設置無需學習成本的屬性改變編輯器的外觀；
26、所述屬性包括height、maxheight、minheight、width、maxwidth、minwidth、editable、readonly、placeholder。
27、進一步的，一種提高自定義代碼編輯器開發效率的方法，所述正常編輯器和放大編輯器內容同步，當用戶編輯小篇幅的頁面時使用正常編輯器，當用戶編輯大篇幅的頁面時彈出放大編輯器進行編輯。
28、進一步的，一種提高自定義代碼編輯器開發效率的方法，所述提示時機為用戶輸入表達式時，根據傳入參數的期望值類型和表達式的執行結果進行提示。
29、進一步的，一種提高自定義代碼編輯器開發效率的方法，所述語言使用javascript時，進行實時的語法校驗，明確標識出報錯位置及報錯信息。
30、進一步的，一種提高自定義代碼編輯器開發效率的方法，所述s27還包括以下子步驟：
31、s271：提供可操作編輯器的設置焦點、設置焦點位置、獲取焦點位置的方法；
32、s272：編輯器獲取焦點和失去焦點時，調用執行外部傳入的方法。
33、本專利技術的有益效果：通過一種提高自定義代碼編輯器開發效率的方法，解決了編輯器自定義開發學習成本高和開發難度較大，及無法智能提示錯誤信息的問題，能夠即引入即使用，配置參數簡單易懂，并且在基礎用法的基礎上，提供了更加豐富的功能且用戶體驗更友好化，讓開發人員使用更自如。
本文檔來自技高網...【技術保護點】
1.一種提高自定義代碼編輯器開發效率的方法，其特征在于，步驟為：
2.根據權利要求1所述的一種提高自定義代碼編輯器開發效率的方法，其特征在于，所述步驟S1還包括以下子步驟：
3.根據權利要求2所述的一種提高自定義代碼編輯器開發效率的方法，其特征在于，所述相關文件路徑結構包括CodeMirror目錄、components目錄、HintToolTip目錄、utils目錄、index.tsx文件、interface.ts文件；
4.根據權利要求1所述的一種提高自定義代碼編輯器開發效率的方法，其特征在于，所述步驟S2還包括以下子步驟：
5.根據權利要求4所述的一種提高自定義代碼編輯器開發效率的方法，其特征在于，所述正常編輯器和放大編輯器內容同步，當用戶編輯小篇幅的頁面時使用正常編輯器，當用戶編輯大篇幅的頁面時彈出放大編輯器進行編輯。
6.根據權利要求4所述的一種提高自定義代碼編輯器開發效率的方法，其特征在于，所述提示時機為用戶輸入表達式時，根據傳入參數的期望值類型和表達式的執行結果進行提示。
7.根據權利要求4所述的
8.根據權利要求4所述的一種提高自定義代碼編輯器開發效率的方法，其特征在于，所述S27還包括以下子步驟：
...【技術特征摘要】
1.一種提高自定義代碼編輯器開發效率的方法，其特征在于，步驟為：
2.根據權利要求1所述的一種提高自定義代碼編輯器開發效率的方法，其特征在于，所述步驟s1還包括以下子步驟：
3.根據權利要求2所述的一種提高自定義代碼編輯器開發效率的方法，其特征在于，所述相關文件路徑結構包括codemirror目錄、components目錄、hinttooltip目錄、utils目錄、index.tsx文件、interface.ts文件；
4.根據權利要求1所述的一種提高自定義代碼編輯器開發效率的方法，其特征在于，所述步驟s2還包括以下子步驟：
5.根據權利要求4所述的一種提高自定義代碼編...
【專利技術屬性】
技術研發人員：朱思禹，田吉，李佳，劉彪，婁江南，李成，楊爽，牛建平，孫大臣，管春元，謝斌，焦質曄，滕訓超，孫增強，
申請(專利權)人：啟明信息技術股份有限公司，
類型：發明
國別省市：
還沒有人留言評論。發表了對其他瀏覽者有用的留言會獲得科技券。