入门篇

[TOC] ## 前言 从之前的教程中你也许知道了一些npm script的基本命令，但是深入的使用并用之更好的引导实践你可能还不清楚。 ## 包初始化 ### 基本初始化 npm init 可以实现基本的包文件初始化，在一系列的确认选择中你可以输入自己设置的包文件的基本信息。 ### 使用默认设置 如果你想跳过这些基本的配置，你可以通过npm init -f 使用默认配置来完成包文件的初始化 ~~~ npm init -f npm WARN using --force I sure hope you know what you are doing. Wrote to /Users/bingo/Documents/work/demo2/package.json: { "name": "demo2", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "keywords": [], "author": "", "license": "ISC" } ~~~ ### 自定义初始化配置 你可以通过配置文件实现自定义包文件的默认配置 ~~~ cnpm config set init.author.name 'zhangbing' cnpm config set init.author.email 'hdu007@163.com' cnpm config set init.author.url 'http://github.com/csnikey' cnpm config set init.license 'MIT' cnpm config set init.version '1.0.0' cnpm config set init.scripts.start 'node index.js' //查看相关的配置项 cat ~/.npmrc init.author.name=zhangbing init.author.email=hdu007@163.com init.author.url=http://github.com/csnikey init.license=MIT init.version=1.0.0 ~~~ ## 运行命令 ### 运行命令 ~~~ npm run == npm run-script npm run start npm run dev ~~~ ### 简写 对于特定的一些命令，不需要加run ，这些有`start test stop restart `,可以直接`npm start`运行 ## 配置eslint 前置知识：在npm script中执行的命令默认支持/node_modules/.bin 执行的相关命令。 ### 基本配置初始化 你可以通过eslint init 实现基本的格式配置，在一系列的操作之后可以生成一个eslint的相关配置文件。你可以基于这个修改你的配置文件，也可以与团队商定之后自定义团队的规则去完成代码的规范部分。 ~~~ ./node_modules/.bin/eslint --init How would you like to configure ESLint? Answer questions about your style ? Are you using ECMAScript 6 features? Yes ? Are you using ES6 modules? Yes ? Where will your code run? Browser ? Do you use CommonJS? Yes ? Do you use JSX? Yes ? Do you use React? Yes ? What style of indentation do you use? Tabs ? What quotes do you use for strings? Single ? What line endings do you use? Unix ? Do you require semicolons? Yes ? What format do you want your config file to be in? JavaScript Successfully created .eslintrc.js file in /Users/bingo/Documents/work/demo2 ~~~ ### script 配置 在script中你可以直接配置 `eslint :"eslint xxx.file"`,检查结果会帮你输出所有的错误以及可能的修改建议。 ~~~ 1:7 error 'a' is assigned a value but never used no-unused-vars 1:14 error Missing semicolon semi 2:7 error 'url' is assigned a value but never used no-unused-vars 2:13 error Strings must use singlequote quotes 2:19 error Missing semicolon semi ✖ 5 problems (5 errors, 0 warnings) 3 errors, 0 warnings potentially fixable with the `--fix` option. ~~~ ### 进一步依赖 ## 跨平台方案 你一定会有需要设置npm工作流在mac ,linux 以及win都可以用的，那么必然性的需要知道常用的跨平台的工具模块。下面从不同用途为大家介绍一些模块。 ### 设置环境或者变量 备注 ：记得给项目里装上模块的包依赖哦，在这个模块使用的时候你可以设置全局的环境变量，不止于NODE_ENV. ~~~ cnpm i cross-env -D //package.json "scripts": { "dev": " cross-env NODE_ENV=development&& webpack -d --watch --color", }, ~~~ - [cross-env模块](https://npm.taobao.org/package/cross-env) ### 文件管理 ## 其他 ### 简写依赖 如果你想把包依赖撞到dev中，你可以通过-D实现，你之前可能是通过--save-dev实现的，两者等效。`cnpm i eslint -D ` ###