參考:https://www.cnblogs.com/mengfangui/p/11174583.html 或 https://www.cnblogs.com/tzyy/p/5193811.html(推薦,比較詳細)

{ // 名稱 "name": "vue", // 版本 "version": "2.6.10", // 描述 "description": "Reactive, component-oriented view layer for modern web interfaces.", // npm包項目的主要入口文件,必須的 "main": "dist/vue.runtime.common.js", // rollup 打包需要的入口文件 "module": "dist/vue.runtime.esm.js", // npm 上所有的文件都開啟 cdn 服務地址 "unpkg": "dist/vue.js", // jsdelivr cdn公共庫 "jsdelivr": "dist/vue.js", // TypeScript 的入口文件 "typings": "types/index.d.ts", // 當你發布package時,具體那些文件會發布上去 "files": [ "src", "dist/*.js", "types/*.d.ts" ], // 聲明該模塊是否包含 sideEffects(副作用),從而可以為 tree-shaking 提供更大的優化空間。 "sideEffects": false, "scripts": { "dev": "rollup -w -c scripts/config.js --environment TARGET:web-full-dev", "dev:cjs": "rollup -w -c scripts/config.js --environment TARGET:web-runtime-cjs-dev", "dev:esm": "rollup -w -c scripts/config.js --environment TARGET:web-runtime-esm", "dev:test": "karma start test/unit/karma.dev.config.js", "dev:ssr": "rollup -w -c scripts/config.js --environment TARGET:web-server-renderer", "dev:compiler": "rollup -w -c scripts/config.js --environment TARGET:web-compiler ", "dev:weex": "rollup -w -c scripts/config.js --environment TARGET:weex-framework", "dev:weex:factory": "rollup -w -c scripts/config.js --environment TARGET:weex-factory", "dev:weex:compiler": "rollup -w -c scripts/config.js --environment TARGET:weex-compiler ", "build": "node scripts/build.js", "build:ssr": "npm run build -- web-runtime-cjs,web-server-renderer", "build:weex": "npm run build -- weex", "test": "npm run lint && flow check && npm run test:types && npm run test:cover && npm run test:e2e -- --env phantomjs && npm run test:ssr && npm run test:weex", "test:unit": "karma start test/unit/karma.unit.config.js", "test:cover": "karma start test/unit/karma.cover.config.js", "test:e2e": "npm run build -- web-full-prod,web-server-basic-renderer && node test/e2e/runner.js", "test:weex": "npm run build:weex && jasmine JASMINE_CONFIG_PATH=test/weex/jasmine.js", "test:ssr": "npm run build:ssr && jasmine JASMINE_CONFIG_PATH=test/ssr/jasmine.js", "test:sauce": "npm run sauce -- 0 && npm run sauce -- 1 && npm run sauce -- 2", "test:types": "tsc -p ./types/test/tsconfig.json", "lint": "eslint src scripts test", "flow": "flow check", "sauce": "karma start test/unit/karma.sauce.config.js", "bench:ssr": "npm run build:ssr && node benchmarks/ssr/renderToString.js && node benchmarks/ssr/renderToStream.js", "release": "bash scripts/release.sh", "release:weex": "bash scripts/release-weex.sh", "release:note": "node scripts/gen-release-note.js", "commit": "git-cz" }, // 代碼質量檢查 "gitHooks": { "pre-commit": "lint-staged", "commit-msg": "node scripts/verify-commit-msg.js" }, // 代碼檢查 "lint-staged": { "*.js": [ "eslint --fix", "git add" ] }, // git倉庫所在位置 "repository": { "type": "git", "url": "git+https://github.com/vuejs/vue.git" }, // 關鍵詞 "keywords": [ "vue" ], // 作者 "author": "Evan You", // 開源協議 "license": "MIT", // bug地址 "bugs": { "url": "https://github.com/vuejs/vue/issues" }, // 主頁 "homepage": "https://github.com/vuejs/vue#readme", // 依賴 "devDependencies": { "@babel/core": "^7.0.0", "@babel/plugin-proposal-class-properties": "^7.1.0", "@babel/plugin-syntax-dynamic-import": "^7.0.0", "@babel/plugin-syntax-jsx": "^7.0.0", "@babel/plugin-transform-flow-strip-types": "^7.0.0", "@babel/preset-env": "^7.0.0", "@babel/register": "^7.0.0", "@types/node": "^10.12.18", "@types/webpack": "^4.4.22", "acorn": "^5.2.1", "babel-eslint": "^10.0.1", "babel-helper-vue-jsx-merge-props": "^2.0.3", "babel-loader": "^8.0.4", "babel-plugin-istanbul": "^5.1.0", "babel-plugin-transform-vue-jsx": "^4.0.1", "babel-preset-flow-vue": "^1.0.0", "buble": "^0.19.3", "chalk": "^2.3.0", "chromedriver": "^2.45.0", "codecov": "^3.0.0", "commitizen": "^2.9.6", "conventional-changelog": "^1.1.3", "cross-spawn": "^6.0.5", "cz-conventional-changelog": "^2.0.0", "de-indent": "^1.0.2", "es6-promise": "^4.1.0", "escodegen": "^1.8.1", "eslint": "^5.7.0", "eslint-plugin-flowtype": "^2.34.0", "eslint-plugin-jasmine": "^2.8.4", "file-loader": "^3.0.1", "flow-bin": "^0.61.0", "hash-sum": "^1.0.2", "he": "^1.1.1", "http-server": "^0.11.1", "jasmine": "^2.99.0", "jasmine-core": "^2.99.0", "karma": "^3.1.1", "karma-chrome-launcher": "^2.1.1", "karma-coverage": "^1.1.1", "karma-firefox-launcher": "^1.0.1", "karma-jasmine": "^1.1.0", "karma-mocha-reporter": "^2.2.3", "karma-phantomjs-launcher": "^1.0.4", "karma-safari-launcher": "^1.0.0", "karma-sauce-launcher": "^2.0.2", "karma-sourcemap-loader": "^0.3.7", "karma-webpack": "^4.0.0-rc.2", "lint-staged": "^8.0.0", "lodash": "^4.17.4", "lodash.template": "^4.4.0", "lodash.uniq": "^4.5.0", "lru-cache": "^5.1.1", "nightwatch": "^0.9.16", "nightwatch-helpers": "^1.2.0", "phantomjs-prebuilt": "^2.1.14", "puppeteer": "^1.11.0", "resolve": "^1.3.3", "rollup": "^1.0.0", "rollup-plugin-alias": "^1.3.1", "rollup-plugin-buble": "^0.19.6", "rollup-plugin-commonjs": "^9.2.0", "rollup-plugin-flow-no-whitespace": "^1.0.0", "rollup-plugin-node-resolve": "^4.0.0", "rollup-plugin-replace": "^2.0.0", "selenium-server": "^2.53.1", "serialize-javascript": "^1.3.0", "shelljs": "^0.8.1", "terser": "^3.10.2", "typescript": "^3.1.3", "webpack": "~4.28.4", "weex-js-runtime": "^0.23.6", "weex-styler": "^0.3.0", "yorkie": "^2.0.0" }, // 設置一些用於npm包的腳本命令會用到的配置參數 "config": { "commitizen": { "path": "./node_modules/cz-conventional-changelog" } } }
說明:作為包的 package.json 文件 和 作為頂層項目目錄下的 package.json 是有點區別。項目目錄下 的 package 文件 ,字段不是 很嚴格的要求。
1、main :npm包項目的主要入口文件,必須的。
2、typings: TypeScript 的入口文件。【npm 包中 package.json 可能會有,項目下的 根據開發者自己定】
個人理解:typings 字段 就是方便 IDE 識別、編譯、智能提示 js 語法的 工具。項目中 引入包,根據 main字段 引入文件的。
typings 的入口文件 里面的代碼 只是 為 編輯器 智能提示 服務的【同時,開發人員 通過這個 文件,可以找到 某個方法具體有哪些 參數 以及 參數類型】。
真正執行的程序是不會執行 這里面的 代碼的;所以 編輯器 跳轉 是先根據 typings 字段進行跳轉的,如果 沒有這個字段 再跳轉 main 字段的文件。
經驗:webstorm中npm包的 類型聲明 中 interface 定義的類型 類型變量,跳轉時 可以跳轉 到 ts 的源 文件的定義處。
3、包 版本的 的問題:package.json中包的版本不一定是指定版本,可能是版本的也范圍。https://blog.csdn.net/qq_29180565/article/details/106674104
npm 包 設定的版本規則:主版本號.次版本號.修補版本號
- version :指定版本。比如
1.2.2
,遵循“大版本.次要版本.小版本”的格式規定,安裝時只安裝指定版本。 - ~version:大概匹配某個版本。比如
~1.2.2
,表示安裝1.2.x的最新版本(不低於1.2.2),但是不安裝1.3.x,也就是說安裝時不改變大版本號和次要版本號。 - ^version:兼容某個版本。比如ˆ1.2.2,表示安裝1.x.x的最新版本(不低於1.2.2),但是不安裝2.x.x,也就是說安裝時不改變大版本號。
- latest :安裝最新版本。
- >version:必須大於某個版本。
- >=version:可大於或等於某個版本。
- X :x號的位置表示任意版本。如:1.2.x,表示可以1.2.0,1.2.1,…,1.2.n
擴展:
1、VS Code使用typings拓展自動補全功能:https://blog.csdn.net/weixin_33709364/article/details/91473830 或 https://blog.csdn.net/cuo9958/article/details/77989407(推薦)
a、npm 包 要使 編輯器有 智能提示,有 兩種方法:使用 TypeScript 編寫 源代碼,或者 給 JS 添加 TS 的類型聲明文件 index.d.ts 。
JS 的 類型 聲明 文件 都是 以 .d.ts 作為后綴名 的文件,在里面寫各種提示的邏輯【只是提示的邏輯,而不是程序 執行的 邏輯】。
2、