vue.config和editorconfig

我們在做項目的時候,應該給經常用到的文件配置它的別名,這樣做,既可以方便引用,也可以防止當文件位置發生改變的時候出現錯誤。

? ??????配置前:

????????import bartar from '../../components/bartar'

????????配置后(不用再關心文件層級關系):

????????import bartarfrom 'components/bartar'

? ? ? ? 那么,我們應該如何進行配置呢?

? ? ? ? 在根目錄下,創建一個vue.config.js文件,添加如下代碼:

????module.exports= {

????configureWebpack: {

????????????resolve: {

????????????alias: {

????????????????'assets':'@/assets',

? ? ? ? ????????'common':'@/common',

? ? ? ????????? 'components':'@/components',

? ? ? ????????? 'network':'@/network',

? ? ? ?????????'views':'@/views'

? ? ????????????? }

????????????}

????????}

}

?

EditorConfig是什么

在項目里,大多時候都能看到.editorconfig文件,剛開始總是忽視掉它,認為它不太重要。但是,它的存在,必定有它的理由,于是,抽空來研究一下,它是什么,能做什么。

?官網是這么介紹EditorConfig的,“EditorConfig幫助開發人員在不同的編輯器和IDE之間定義和維護一致的編碼樣式。EditorConfig項目由用于定義編碼樣式的文件格式和一組文本編輯器插件組成,這些插件使編輯器能夠讀取文件格式并遵循定義的樣式。EditorConfig文件易于閱讀,并且與版本控制系統配合使用。”

不同的開發人員,不同的編輯器,有不同的編碼風格,而EditorConfig就是用來協同團隊開發人員之間的代碼的風格及樣式規范化的一個工具,而.editorconfig正是它的默認配置文件。

幫助開發者在不同IDE中保持一致的代碼風格。工程中有.editorconfig配置文件及使用的IDE默認支持EditorConfig或安裝插件支持即可。(VSCode是安裝插件支持)

# 告訴EditorConfig插件,這是根文件,不用繼續往上查找
root = true# 匹配全部文件
[*]
# 結尾換行符,可選"lf"、"cr"、"crlf"
end_of_line = lf
# 在文件結尾插入新行
insert_final_newline = true
# 刪除一行中的前后空格
trim_trailing_whitespace = true
# 匹配js和py結尾的文件
[*.{js,py}]
# 設置字符集
charset = utf-8# 匹配py結尾的文件
[*.py]
# 縮進風格,可選"space"、"tab"
indent_style = space
# 縮進的空格數
indent_size = 4# 以下匹配,類同
[Makefile]
indent_style = tab
# tab的寬度
tab_width = 4# 以下匹配,類同
[lib/**.js]
indent_style = space
indent_size = 2[{package.json,.travis.yml}]
indent_style = space
indent_size = 2

1、如果是windows用戶,如果無法創建.editorconfig文件,則需要先創建.editorconfig.文件,系統會自動重命名成.editorconfig文件。

2、EditorConfig的匹配規則是從上往下,即先定義的規則優先級比后定義的優先級要高。

3、插件安裝,在GitHub上已經有了各種流行編輯器的插件源代碼,可根據說明安裝。

4、對于VS Core,對應的插件名是EditorConfig for VS Code。

5、這里列舉了VS Code支持的規則:

  • indent_style
  • indent_size
  • tab_width
  • end_of_line
  • insert_final_newline
  • trim_trailing_whitespace

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/247393.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/247393.shtml
英文地址,請注明出處:http://en.pswp.cn/news/247393.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

Java生鮮電商平臺-訂單配送模塊的架構與設計

Java生鮮電商平臺-訂單配送模塊的架構與設計 生鮮電商系統最終的目的還是用戶下單支付購買, 所以訂單管理系統是電商系統中最為復雜的系統,其作為中樞決定著整個商城的運轉, 本文將對于生鮮類電商平臺的訂單設計做一個完整的分析,…

vue項目,webpack中配置src路徑別名及使用

默認會有‘’別名,指向src目錄,還可以添加自定義別名等等。 使用方法 使用別名一般就三種情況:在js中用,在css中用,在html文檔內用 js中用,最簡單: import {getName} from /util/namecss中使用&#xff0…

fastclick庫的介紹和使用

移動端點擊延遲事件 1. 移動端瀏覽器在派發點擊事件的時候,通常會出現300ms左右的延遲 2. 原因: 移動端的雙擊會縮放導致click判斷延遲 fastclick 是具有消除移動端瀏覽器上的點擊事件的 300ms 的延遲的作用。 注意幾點 1、PC端無效 2、Android 上的 Chrome …

toString()和String.valueOf()的區別(轉)

慣例廣告一發,對于初學真,真的很有用www.java1234.com,去試試吧! 有的朋友在用這兩個的時候感覺差不多 其實,很多時候效果是差不多的 但是,有的時候用.toString()會報錯,而用String.valueOf()就…

kylin框架中使用postcss-px2rem

1.kylin框架的使用不做介紹 2.頁面中 html模板頁面中已經使用clientWidth/375*100px,已經賦值了html的fontsize隨頁面寬度而變化。 比如寬度375的屏 html的fontsize為100px kylin加載postcss-px2rem cnpm i --save-dev postcss-px2rem 在根目錄下的plugin.js中 var px2rem…

VS2005無法啟動解決方法(轉)

一直有一個問題困擾,VS2005用得好好滴,突然有一天開始就進不去了,啟動了以后,沒有任何界面的出現,但是打開任務管理器,卻能夠看到進程的存在,真是奇怪了,我試圖卸載并且重新安裝&…

kylinH5框架之項目組件理解

目錄 組件介紹 組件聲明結構 組件接口 script dependency template style 狀態注入 接口聲明 組件介紹 Component 擴充自 Vue 的組件, 提供了 Vue 組件對等的輸入參數能力。在代碼書寫時提供類 class 的裝飾器 Decorator 風格。 import { Component, Watch } from al…

Markdown 語法簡介

這是標題一 標題二 標題三 print(hello) 這是一個python 第一點 thiw dhaishd 第二點 轉載于:https://www.cnblogs.com/BlogOfEr/p/11229682.html

kylinH5框架之項目開發調試

進行開發調試,需要完成以下步驟: 安裝依賴開發調試構建生產 點擊 代碼示例,獲取 Kylin Demo,并完成以下操作。 安裝依賴 進入項目根目錄,使用 cnpm 安裝 npm 依賴: # 安裝npm依賴 cnpm install 開發調試…

Java生鮮電商平臺-深入訂單拆單架構與實戰

Java生鮮電商平臺-深入訂單拆單架構與實戰 Java生鮮電商中在做拆單的需求,細思極恐,思考越深入,就會發現里面涉及的東西越來越多,要想做好訂單拆單的功能,還是相當有難度, 因此總結了一下拆單功能細節&…

python3中Requests將verify設置為False后,取消警告的方式

import requests resp requests.get(https://www.***.com, verifyFalse)調用成功但是會有如下警告信息: InsecureRequestWarning: Unverified HTTPS request is being made. Adding certificate verification is strongly advised. See: https://urllib3.readthedo…

kylinH5框架之項目腳手架

頁面介紹 Page 是一個 Webview 的邏輯抽象層,同時也是組件掛載的根節點。 代碼引入 import { Page } from ali/kylin-framework; 頁面聲明結構 一個Page包含的接口在頁面接口中聲明,提供了對 Vue 實例的完整控制能力,簡易的 Page 使用如…

博弈論學習筆記

決定近段時間復習一下博弈論順便寫點筆記。 大佬博客:幾種常見博弈模型https://blog.csdn.net/wr132/article/details/51213331 SG函數與SG定理https://www.cnblogs.com/ECJTUACM-873284962/p/6921829.html 無敵的博弈總結https://blog.csdn.net/acm_cxlove/article…

Promise鏈式調用和解決回調地獄的ES7終極解決方法async,await

promise鏈式調用 **then 是成功回調&#xff0c;只要在then后邊return一個promise就可以繼續then**<script type"text/javascript">let p1new Promise(function(resolve,reject){setTimeout(function(){resolve()//成功回調// reject()//失敗回調},2000)//2秒…

1.MySQL目錄結構

分為兩個目錄&#xff1a; 1.安裝目錄&#xff1a; 2.數據目錄&#xff1a; 在Linux下 yum安裝mysql后使用 find / -name my.cnf 找到mysql數據文件的位置 轉載于:https://www.cnblogs.com/sdrbg/p/11237231.html

對promise.all底層的實現的研究

1.Promise.all(iterable)返回一個新的Promise實例,此實例在iterable參數內素有的Promise都fulfilled或者參數中不包含Promise時&#xff0c;狀態變成fulfilled。 如果參數中Promise有一個失敗rejected &#xff0c;此實例回調失敗&#xff0c;失敗原因的是第一個失敗Promise的返…

vue-provide/inject輕松實現跨級訪問祖先組件

provide&#xff1a;Object | () > Object inject&#xff1a;Array<string> | { [key: string]: string | Symbol | Object } provide 和 inject 主要為高階插件/組件庫提供用例。并不推薦直接用于應用程序代碼中。是2.2.0版本 新增的。 這對選項需要一起使用&#x…

python 操作redis,存取為字節格式,避免轉碼加

這種情況連接數據庫&#xff0c;對數據的存取都是字節類型&#xff0c;存取時還得轉碼一下 from redis import Redis# 實例化redis對象rdb Redis(hostlocalhost, port6379, db0,passwordaaa123) rdb.set(name, root) name rdb.get(name) print(name)為了避免上述情況&#x…

element ui table scrollTop 滾動到行頭或行尾

1.設置table的ref為tableList2.設置滾動至頂部this.$refs.tableList.bodyWrapper.scrollTop 0;3.設置滾動至底部this.$refs.tableList.bodyWrapper.scrollTop this.$refs.tableList.bodyWrapper.scrollHeight;//如果請求完更新數據&#xff0c;需要使用$nextTick this.$nextTic…

Element-UI中Drawer抽屜去除標題自帶藍色框

當點擊事件drawertrue時&#xff0c;抽匣回打開 這時抽匣的標題會出現一個難看的藍色邊框&#xff0c;一會就會消失&#xff0c;但是好丑&#xff0c;所以要去掉它 解決方法 /deep/ :focus {outline: 0;} vue組件中&#xff0c;在style設置為scoped的時候&#xff0c;里面在…