package.json配置瞭解。
/*
* 對項目或者模塊包的描述，裏面包含許多元信息。比如項目名稱，項目版本，項目執行入口文件等等。
* npm install 命令會根據這個文件下載所有依賴模塊。
*/
{
"name": "ms",//項目（模塊）名稱
"version": "0.0.1",//版本
"author": "pottry<xxxx>",//作者
"description": "前端開發框架",//項目（模塊）描述
"homepage": "",//首頁
"license": "MIT",
"scripts": { //執行 npm 腳本命令簡寫
"start": "vite", //vite 開發環境啓動
"preview": "vite preview --port 9001", //預覽
"build": "vite build && node scripts/release.mjs", //構建打包
"type-check": "vue-tsc --noEmit", //類型檢查
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore" //代碼風格檢查
},
"dependencies": { //項目依賴。在編碼階段和呈現頁面階段都需要的，npm install -S 保存位置
//Element Plus 提供的一套常用的圖標集合，參看：https://element-plus.gitee.io/zh-CN/component/icon.html#%E5%9B%BE%E6%A0%87%E9%9B%86%E5%90%88
"@element-plus/icons-vue": "^2.0.6",
//一些日誌預覽，還有文件的預覽，需要進行代碼高亮顯示的插件，參看：https://www.npmjs.com/package/@highlightjs/vue-plugin?activeTab=readme
"@highlightjs/vue-plugin": "^2.1.0",
//富文本編輯器，參看：https://www.wangeditor.com/v5/for-frame.html#vue3
"@wangeditor/editor": "^5.1.12",
"@wangeditor/editor-for-vue": "^5.1.12",
//基於pormise的網絡請求，參看：https://www.axios-http.cn/docs/intro
"axios": "^0.27.2",
//一個解析器和轉換器，用於Tab Atkins提出的CSS顏色函數，參看：https://www.npmjs.com/package/css-color-function
"css-color-function": "^1.3.3",
//百度圖表組件，參看:https://echarts.apache.org/handbook/zh/
"echarts": "^5.3.3",
//elemetUI框架，https://element-plus.gitee.io/zh-CN/guide/installation.html
"element-plus": "^2.2.9",
//突出js是用JavaScript編寫的語法高亮，參看：https://www.npmjs.com/package/highlight.js
"highlight.js": "^11.6.0",
//ajax請求進度條，參看：https://www.npmjs.com/package/nprogress
"nprogress": "^0.2.0",
//直觀、類型安全、靈活的vue存儲，參看：https://www.npmjs.com/package/pinia
"pinia": "^2.0.14",
//用於構建現代web UI的漸進式JavaScript框架，參看：github.com/vuejs/core
"vue": "^3.2.37",
//vue3剪切板，參看：https://www.npmjs.com/package/vue-clipboard3
"vue-clipboard3": "^2.0.0",
//vue for echarts，參看：https://www.npmjs.com/package/vue-echarts
"vue-echarts": "^6.2.3",
//路由，參看：https://github.com/vuejs/router#readme
"vue-router": "^4.0.16",
//適用於 Vue3 的 hls.js 播放器組件 | 並且支持 MP4/WebM/Ogg 格式 配置強大，參看：https://www.npmjs.com/package/vue3-video-play
"vue3-video-play": "^1.3.1-beta.6",
//vue3拖拉組件，參看：https://github.com/SortableJS/vue.draggable.next
"vuedraggable": "^4.1.0"
},
"devDependencies": {//開發依賴。僅僅在寫代碼過程中需要使用,比如css預處理器、vue-cli腳手架、eslint之類。npm install -D 保存位置
"@rushstack/eslint-patch": "^1.1.0",
//一個插件，它提供了在固定行數之後可視化截斷文本的實用程序,參看：https://www.npmjs.com/package/@tailwindcss/line-clamp
"@tailwindcss/line-clamp": "^0.4.2",
//This package contains type definitions for lodash-es,是es6下的實用工具庫，降低 array、number、objects、string 等等的使用難度等，參看：https://lodash.com/
"@types/lodash-es": "^4.17.6",
//nodejs
"@types/node": "^16.11.41",
//This package contains type definitions for NProgress
"@types/nprogress": "^0.2.0",
//提供 Vue 3 單文件組件支持，參看：https://vitejs.cn/plugins/
"@vitejs/plugin-vue": "^3.0.0",
//提供 Vue 3 JSX 支持（通過 專用的 Babel 轉換插件）。參看：https://vitejs.cn/plugins/
"@vitejs/plugin-vue-jsx": "^2.0.0",
//
"@vue/eslint-config-prettier": "^7.0.0",
"@vue/eslint-config-typescript": "^11.0.0",
//TSConfigs for Vue projects to extend. 參看：https://www.npmjs.com/package/@vue/tsconfig
"@vue/tsconfig": "^0.1.3",
//PostCSS插件，用於解析CSS並使用Can I Use中的值向CSS添加前綴。參看：https://www.npmjs.com/package/autoprefixer
"autoprefixer": "^10.4.7",
//好用的打印輸出,console.success等帶顏色，參看：https://www.npmjs.com/package/consola
"consola": "^2.15.3",
//ESLint 是一個語法規則和代碼風格的檢查工具，可以用來保證寫出語法正確、風格統一的代碼。參看：https://www.npmjs.com/package/eslint
"eslint": "^8.5.0",
//vue官方ESLint插件，參看：https://github.com/vuejs/eslint-plugin-vue
"eslint-plugin-vue": "^9.0.0",
//調用操作系統接口，參看:https://github.com/sindresorhus/execa
"execa": "^6.1.0",
//node中文件操作的替代品。參看：https://www.npmjs.com/package/fs-extra
"fs-extra": "^10.1.0",
//PostCSS 是一個允許使用 JS 插件轉換樣式的工具。 這些插件可以檢查（lint）你的 CSS，支持 CSS Variables 和 Mixins， 編譯尚未被瀏覽器廣泛支持的先進的 CSS 語法，內聯圖片，以及其它很多優秀的功能。參看：https://github.com/postcss/postcss/blob/HEAD/docs/README-cn.md
"postcss": "^8.4.14",
"prettier": "^2.5.1",
//將腳本轉換爲css的工具
"sass": "^1.53.0",
//css編程語言，功能優先方案，參看：https://www.tailwindcss.cn/docs/utility-first
"tailwindcss": "^3.0.24",
//ts超集編程語言，參看：https://www.npmjs.com/package/typescript
"typescript": "~4.7.4",
"unplugin-auto-import": "^0.9.2",
"unplugin-vue-components": "^0.19.9",
//新一代前端工具，參看：https://github.com/vitejs/vite
"vite": "^3.0.0",
//由於 vite 本身已按需導入了組件庫，因此僅樣式不是按需導入的，因此只需按需導入樣式即可。參看：https://github.com/vbenjs/vite-plugin-style-import/blob/main/README.zh_CN.md
"vite-plugin-style-import": "^2.0.0",
//生成svg雪碧圖（精靈圖），參看：https://github.com/vbenjs/vite-plugin-svg-icons/blob/main/README.zh_CN.md
"vite-plugin-svg-icons": "^2.0.1",
//使vue腳本對setup語法支持name屬性，參看：https://github.com/vbenjs/vite-plugin-vue-setup-extend
"vite-plugin-vue-setup-extend": "^0.4.0",
//Vue 3命令行類型檢查工具基於IDE插件Volar。參看：https://www.npmjs.com/package/vue-tsc
"vue-tsc": "^0.38.1"
}
}
插件版本控制說明：
- 插件名稱：“1.1.0”：表示安裝1.1.0版本
- 插件名稱："~1.1.0"：表示安裝1.1.x的最新版本（不低於1.1.0）也就是說安裝時不改變大版本號和次要版本號。
- 插件名稱："^1.1.0"：表示安裝1.1.0及以上的版本，但是不安裝2.0.0，也就是說安裝時不改變大版本號。
