一、初步理解

1. npm安装package.json时  直接转到当前项目目录下用命令npm installnpm install --save-dev安装即可,自动将package.json中的模块安装到node-modules文件夹下

2. package.json 中添加中文注释会编译出错

3. 每个项目的根目录下面,一般都有一个package.json文件,定义了这个项目所需要的各种模块,以及项目的配置信息(比如名称、版本、许可证等元数据)。npm install 命令根据这个配置文件,自动下载所需的模块,也就是配置项目所需的运行和开发环境。

4. package.json文件可以手工编写,也可以使用npm init命令自动生成。

二、package.json文件配置详解

1.下面是最简单的的一个package.json 文件(只有两个数据,项目名称和项目版本,他们都是必须的,如果没有就无法install)

{
"name": "reactdemo", //项目名称 
 "version": "1.0.0", //version是版本(遵守“大版本.次要版本.小版本”的格式) }

2.scripts

"scripts": {// scripts指定了运行脚本命令的npm命令行缩写,比比如start指定了运行npm run start时,所要执行的命令。 
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}

3  dependencies,devDependencies

dependencies和devDependencies两项,分别指定了项目运行所依赖的模块、项目开发所需要的模块。它们都指向一个对象,该对象的各个成员,分别由模块名和对应的版本要去组成,表示依赖的模块及其版本范围

--save参数表示将该模块写入dependencies属性,
--save-dev表示将该模块写入devDependencies属性。

"dependencies": {//字段指定了项目运行所依赖的模块 
"antd-mobile": "^2.1.1",
"babel-polyfill": "6.23.0",
"babel-runtime": "^6.22.0",
"rc-form": "^1.3.0",
"react": "15.4.2",
"react-dom": "15.4.2",
"react-height": "^3.0.0",
"react-router": "2.8.1",
"react-svg-use": "^2.1.0",
"whatwg-fetch": "^2.0.1"
},
"devDependencies": {//指定项目开发所需要的模块 
"babel-eslint": "^7.1.1",
"babel-plugin-dva-hmr": "^0.3.2",
"babel-plugin-import": "^1.1.0",
"babel-plugin-transform-runtime": "^6.22.0",
"eslint": "^3.14.0",
"eslint-config-airbnb": "^14.0.0",
"eslint-plugin-import": "^2.2.0",
"eslint-plugin-jsx-a11y": "^3.0.2",
"eslint-plugin-react": "^6.9.0",
"expect": "^1.20.2",
"html-webpack-plugin": "^2.28.0",
"husky": "^0.13.0",
"less-vars-to-js": "^1.1.2",
"postcss-pxtorem": "^4.0.0",
"qrcode.react": "^0.7.1",
"react-helmet": "^5.1.3",
"redbox-react": "^1.3.2",
"roadhog": "0.6.0",
"svg-sprite-loader": "^2.0.5",
"webpack": "^1.14.0"
},

  

package.json的配置理解的更多相关文章

  1. package.json文件配置详解

    package.json 是npm init命令初始化后,在项目的根目录下自动生成的配置文件,它定义了这个项目的配置信息以及所需要的各种模块,npm install根据这个命令,自动下载所需的模块.p ...

  2. 在package.json中配置Script执行npm run tslint报错问题

    今天在学习tslint的时候,按照git clone下angular2-webpack-starter的代码执行npm run lint时,虽然代码进行了检测,但检测完成后npm始终报错, //pac ...

  3. package.json文件配置信息

    1.概述 每个项目的根目录下面,一般都有一个package.json文件,定义了这个项目所需要的各种模块,以及项目的配置信息(比如名称.版本.许可证等元数据).npm install命令根据这个配置文 ...

  4. package.json中版本理解

    一个完整的版本号可以理解为: [主要版本号,次要版本号,补丁版本号]版本号 x.y.z :其中z 表示一些小的bugfix, y表示一些大的版本更改,比如一些API的变化x表示一些设计的变动及模块的重 ...

  5. package.json中配置浏览器

    "browserlist":[ ">=1%", "last 2 versions" ],

  6. 基于react开发package.json的配置

    项目依赖 react网页开发的3件套: react, react-dom, react-router-dom, redux, react-reduxreact的UI组件库: antd(pc端), an ...

  7. npm package.json属性详解

    概述 本文档是自己看官方文档的理解+翻译,内容是package.json配置里边的属性含义.package.json必须是一个严格的json文件,而不仅仅是js里边的一个对象.其中很多属性可以通过np ...

  8. vue-cli脚手架之package.json

    package.json文件配置及其含义,这个是vue-cli自动生成的文件,先贴一张代码及其含义: { "name": "secondproject",//模 ...

  9. “proxy” in package.json must be a string 解决办法

    今天学习一个react项目.想从本地服务器获取数据. 直接axios.get('http://localhost:80/api/react/header.json'),报错跨域. 网上查了下,需要在p ...

随机推荐

  1. nmap用法

    Nmap 7.70SVN ( https://nmap.org ) Usage: nmap [Scan Type(s)] [Options] {target specification} TARGET ...

  2. 转:彻底搞清楚javascript中的require、import和export

    原文地址:彻底搞清楚javascript中的require.import和export   为什么有模块概念 理想情况下,开发者只需要实现核心的业务逻辑,其他都可以加载别人已经写好的模块. 但是,Ja ...

  3. java详细剖析

    1·类型加载主动初始化和被动初始化两种,通过访问静态变量或者给静态变量赋值都是可以使类初始化,如果有继承关系,所依赖的父类都会被动初始化. 2·如果在类的静态变量中添加final关键字,那这个变量就会 ...

  4. vim模式下报错E37: No write since last change (add ! to override)

    故障现象: 使用vim修改文件报错,系统提示如下: E37: No write since last change (add ! to override) 故障原因: 文件为只读文件,无法修改. 解决 ...

  5. 另存了一次网页之后其它word打开格式都变了

    解决方案: 视图->页面视图 感觉自己很傻...原来另存word为网页后,默认的打开模式就是网页视图了.只需要把视图改回去即可

  6. .net拼接json字符串

    { while (reader.Read()) { if (reader.HasRows) { JSONstring += "{"; JSONstring += "\&q ...

  7. wordCount剖析Spark模型

  8. .Net新利器Rider的破解安装与使用

    准备 介绍 Rider 是 JetBrains 提供的一款用于 .Net 开发的 IDE,相对于 VS,它显得更加轻量(才 500m 左右),并且不管是提示功能还是流畅度都不逊色于 VS 且某方面可能 ...

  9. Opencv-Python No module named 'cv2.cv2'

    关于 No module named 'cv2.cv2'等其他一些问题,一般都是版本不兼容的问题,重装即可. pip uninstall opencv-python 然后 pip install op ...

  10. input实现上传

    很多时候我们会用到上传,实现一个普通的上传也很简单,不用引用繁琐的插件 一个普通的上传 <form action="=upload" method="post&qu ...