nodejs这些年的发展非常快,相信没有哪个前端不知道的了,npm也成为了前端开发中经常用到了的一个命令。那么npm不是只用一个 "npm install xxx"命令就够了吗?实际上并不是这样,发现有些团队在使用npm的时候没有认真去搞懂npm在团队里面或者说是在项目里面的一些用法。

1.从认识package.json开始

  在团队里面开发,一般会分为开发模式和生产模式(可能会有不同的叫法),有时候还有测试模式,那么这些模式其实跟npm有很大的联系的。首先看一个简单的例子,先从npm依赖的package.json文件开始。

{
"name": "test",
"version": "1.0.0",
"description": "test",
"main": "app.js",
"scripts": {
"dev": "gulp dev && node app",
"pro": "node app"
},
"keywords": [
"test"
],
"dependencies": {
"koa": "^1.2.0"
},
"devDependencies": {
"gulp": "^3.9.1",
"koa": "^1.2.0"
},
"author": "test",
"license": "MIT"
}

  这个很简单的package.json写法的例子,这里主要应用的是其中的 scripts、dependencies、devDependencies 这三个设置。

2.dependencies、devDependencies这两个的配置

  关于这个两个配置,大致可以理解为当执行

    npm install xxx --save

  的时候,模块会记录在dependencies里面;

  当执行

    npm install xxx --save-dev

  的时候,模块会记录在devDependencies里面。但是有一点的是,很多人在git clone 项目之后都是直接执行" npm i" 或者 "npm install" 就可以把项目的依赖配置好了,而这两个命令都是安装devDependencies里面的模块,那么还需要dependencies来做什么?

  "npm install" 模式的是开发模式,所以安装模块是devDependencies里面的模块,在开发的时候确实够用了,但是在部署到服务器的时候就不是这样了。上面的package.json,dependencies(对应生产模式)和 devDependencies(对应开发模式),区别只是在于有没有 gulp 这个模块。

  现在反过来想,我们在开发的时候需要用gulp来打包我们的静态文件,那么到了生产模式,也就是部署到了服务器,我们已经不需要gulp来打包了,因为在开发模式把文件打包好,提交代码的时候同步就可以了,所以在部署到服务器的时候我们完全不用多安装gulp这么一个模块了。

  那么生产模式是怎么执行安装呢?很简单,

    npm install --production

  就可以了。这个例子为了理解,只是用了一两个模块,实际项目中生产模式和开发模式肯定不止区别一个模块这么简单,这个时候就更能体现出两种模式分开的必要。

  还要提过的测试模式,测试模式一般是归于开发模式,即把测试模式需要用到的模块放到devDependencies 里面,目前npm是还没有独立出来测试模式的依赖设置。

3.scripts的设置

  大部分人开始开发的时候,对于gulp的构建一般就执行

    gulp

  这个命令,对于运行node的server一般运行

    node app

  这样类似的命令,但是这样在团队里面的开发是不规范的,特别是有些命令加上各种参数,然后比较长的时候就会麻烦了,应该是使用"npm run" 命令和结合scripts的设置。

  scripts是一个object,那么key就是对应的命令,value就是实际上执行的命令,这种命令再长也不怕了。可以看到上面的package.json里面的scripts,里面有两个命令一本是dev另一个是pro,分别对应开发模式和生产模式。

  当团队成员开发的时候只需要运行

    npm run dev

  就可以开始开发,当部署到服务器的时候执行

    npm run pro

  就可以启动服务了。前提是要安装好依赖模块,就是上面说到了两种不同的安装方式。

  实际项目有可能不止这两个命令,具体的命令也可能不一样,比如有可能还有测试模式的命令,又比如只需要打包文件而不要http的服务,那么这时候开发模式和生产模式就是不同的gulp命令了。

4.关于团队使用

  团队中使用,最主要的是规范,像npm这样的使用确实要规范起来,减少团队配合的阻碍吧,只要是增加了什么模式,只需要告诉他看packaga.json里面的scripts, npm run xxx一下就可以了。当然这里在团队使用当中,每个项目都应该有一个README.md 的文档来进行介绍和说明,这里就不详细介绍了。

说说对npm的开发模式和生产模式的理解的更多相关文章

  1. weblogic开发模式与生产模式介绍

    weblogic开发模式与生产模式介绍 开发模式:该模式启用自动部署 生产模式:该模式关闭自动部署 weblogic server 三种部署方法:自动部署.控制台部署.命令部署 自动部署:当其处于启用 ...

  2. webpack开发模式和生产模式设置及不同环境脚本执行

    1. webpack设置开发模式和生产模式 (1). DefinePlugin插件设置 new webpack.DefinePlugin({ 'process.env': { NODE_ENV: '& ...

  3. webpack4 系列教程(十六):开发模式和生产模式·实战

    好文章 https://www.jianshu.com/p/f2d30d02b719

  4. weblogic-开发模式与生产模式互换

    生产转开发 Step 1: 目标文件:domain/bin/setDomainEnv.sh 修改内容:PRODUCTION_MODE="true"改为PRODUCTION_MODE ...

  5. WebLoigc的配置(生产模式与开发模式)

    1.Weblogic两种模式的切换1).生产模式--->开发模式将domain路径下的bin\setDomainEnv.cmd文件中set PRODUCTION_MODE=true改为set P ...

  6. weblogic 生产模式和开发模式的互相转换

    weblogic 生产模式和开发模式的互相转换 学习了:http://blog.csdn.net/qew110123/article/details/45845935 weblogic10.3生产模式 ...

  7. thinkphp---数据表更新字段开发模式可更新生产模式不能更新!

    这里认为是坑的主要原因:这个问题我调试了一天,才发现是缓存的问题. 问题原因:在做一thinkphp的项目,在后期要进行修改.修改的时候,数据表里面添加了两个字段,然后前台修改模板,将添加的字段提交上 ...

  8. ElasticSearch生产模式开发模式的区分

    ElasticSearch生产模式开发模式的区分 network.host: 0.0.0.0 如果network.host不是localhost就是生产模式, 开发模式中的warning就是生产模式中 ...

  9. 2016/5/6 thinkphp ①框架 ② 框架项目部署 ③MVC模式 ④控制器访问及路由解析 ⑤开发和生产模式 ⑥控制器和对应方法创建 ⑦视图模板文件创建 ⑧url地址大小写设置 ⑨空操作空控制器 ⑩项目分组

    真实项目开发步骤: 多人同时开发项目,协作开发项目.分工合理.效率有提高(代码风格不一样.分工不好) 测试阶段 上线运行 对项目进行维护.修改.升级(单个人维护项目,十分困难,代码风格不一样) 项目稳 ...

随机推荐

  1. JSX 和 template 随想

    就目前而言,我用到的前端页面开发框架主要有两种:以JSX为主的react和以template为主的vue. 虽然这两种方式各有千秋,但我其实更偏爱template多一些.为什么? 相较于灵活的JSX, ...

  2. HTML元素ID和JS方法名重复,JS调用失败

    HTML元素ID和JS方法名重复时,JS中的重名方法无法被找到,不能执行. 修改ID或者方法名,两者不一致即可.

  3. java后端导入excel将数据写入数据库

    参考:https://www.cnblogs.com/hanfeihanfei/p/7079210.html @RequestMapping("/importExcel.do") ...

  4. Python学习之二

    基础语法 一.起始行 #!/usr/bin/python 或 #!/usr/bin/env python 目的是在运行python脚本的时候告诉系统我们要用Python解释器去运行py脚本 # -*- ...

  5. sql 游标 跳出循环 和进入下一个循环

    1  使用break 结束整个循环. 2  使用continue 结束当前循环,进入下已循环. 注意:使用continue造成死循环,是因为continue后又执行与上次相同的fetch了. 解决办法 ...

  6. Java获取随机数获取制定范围指定个数不重复的随机数

    一.JDK中提供的两种方式 1.Math类中的random()方法public static double random()返回带正号的 double 值,该值大于等于 0.0 且小于 1.0 [0. ...

  7. C#:WebBrowser控件的使用教程及相关问题整理

    推荐阅读: C#WebBrowser控件使用教程与技巧收集--苏飞收集 C# WebBrowser强制在本窗口打开,禁止在新窗口打开 C# WebBrowser禁止在新窗口打开,强制在本窗口打开(多种 ...

  8. 九、将cs文件快速的转换成可执行文件和响应文件(配置编译开关的文件)

    1.将包含多个类型的源代码文件转换为可以部署的文件.有如下Program.cs的文件,代码如下: public sealed class Program { public static void Ma ...

  9. spring mvc 数据格式化

    web.xml <web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www. ...

  10. Spring mvc 4系列教程(一)

    一.Spring框架概览 Spring框架是一种轻量级.一站式解决企业级应用的解决方案.不仅如此,Spring的模块化的特点,可以使你只引用所需要的部分,而无需引用全部.你可以使用控制反转容器(IoC ...