package.json中homepage属性的作用详解

Package.json 属性说明

  • name - 包名。
  • version - 包的版本号。
  • description - 包的描述。
  • homepage - 包的官网 url 。
  • author - 包的作者姓名。
  • contributors - 包的其他贡献者姓名。
  • dependencies - 依赖包列表。如果依赖包没有安装，npm 会自动将依赖包安装在 node_module 目录下。
  • repository - 包代码存放的地方的类型，可以是 git 或 svn，git 可在 Github 上。
  • main - main 字段指定了程序的主入口文件，require('moduleName') 就会加载这个文件。这个字段的默认值是模块根目录下面的 index.js。
  • keywords - 关键字

做前端开发的同学对 package.json 文件一定不陌生，但我们通常很少去关注它，最熟悉的莫过于几个最基本的属性，如：

  1. name，项目名称
  2. version，项目版本号
  3. dependencies，项目依赖包
  4. scripts，npm命令

package.json 其实还有很多属性可以配置的，这里就介绍一个 homepage 属性的作用。

homepage 的作用是设置应用的跟路径，我们的项目打包后是要运行在一个域名之下的，有时候可能是运行在跟域名下，也有可能运行在某个子域名下或或域名的某个目录下，这时候我们就需要让我们的应用知道去哪里加载资源，这时候就需要我们设置一个跟路径，而且有时候我们的资源会部署在 CDN 上，你必须告诉打包工具你的CDN地址是什么。

比如我们用 create-react-app 开发的 React 应用，以及 Vue CLI 开发的项目，默认是继承了 webpack 的，当不配置 homepage 属性，build 打包之后的文件资源应用路径默认是 / ，如下图

当你设置了 homepage 属性后，比如我这里homepage 设置为 github 的 pages 服务地址

打包后的资源路径就会加上 homepage 的地址。比如上面图片配置好 homepage 之后我打包一个 React 项目，打包后 index.html 页面的资源路径就是：

到此这篇关于package.json中homepage属性的作用详解的文章就介绍到这了,更多相关package.json homepage属性内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • package.json各个属性说明详解

    什么是Node.js的模块(Module)? 在Node.js中,模块是一个库或框架,也是一个Node.js项目.Node.js项目遵循模块化的架构,当我们创建了一个Node.js项目,意味着创建了一个模块,这个模块的描述文件,被称为package.json --  [长城_changcheng] 一般package.json放置在项目根目录下,其基本结构如下图所示: package.json 结构图 属性介绍 description 字符串.用来描述当前项目的大致功能. name 此项目包的名

  • package.json中homepage属性的作用详解

    Package.json 属性说明 name - 包名. version - 包的版本号. description - 包的描述. homepage - 包的官网 url . author - 包的作者姓名. contributors - 包的其他贡献者姓名. dependencies - 依赖包列表.如果依赖包没有安装,npm 会自动将依赖包安装在 node_module 目录下. repository - 包代码存放的地方的类型,可以是 git 或 svn,git 可在 Github 上.

  • 基于IView中on-change属性的使用详解

    本人android开发出身,因工作需要,后台前端的代码也都有涉猎,这两天一直被input标签中的onchange困扰的头昏脑胀,辗转难眠,废话不多说,下面说下遇到的问题和解决办法. 问题产生 之前跟同事刚研究了vue这个牛逼的框架,实现的是省市级三级联动的小功能,部分代码如下: <Form-item label="所在地区" > <Row > <Col span="12"> <select v-model="f.p

  • Java中反射机制和作用详解

    前言 很多刚学Java反射的同学可能对反射技术一头雾水,为什么要学习反射,学习反射有什么作用,不用反射,通过new也能创建用户对象. 那么接下来大师就带你们了解一下反射是什么,为什么要学习反射? 下面我们首先通过一个实例来说明反射的好处: 方法1.不用反射技术,创建用户对象,调用sayHello方法 1.1 我们首先创建一个User类 package com.dashi; /** * Author:Java大师 * User对象,包含用户的id和姓名以及sayHello方法 */ public

  • jQuery中DOM 属性使用实例详解下篇

    目录 DOM属性(下) .html() .val() .attr() .removeAttr() DOM属性(下) .html() 获取集合中第一个匹配元素的HTML内容 在一个 HTML 文档中, 我们可以使用 .html() 方法来获取任意一个元素的内容. 如果选择器匹配多个元素,那么只有第一个匹配元素的 HTML 内容会被获取. $('div.demo-container').html(); html()方法还可以设置每一个匹配元素的html内容. 我们可以使用 .html() 来设置元素

  • jQuery中DOM 属性使用实例详解上篇

    目录 DOM属性(上) .addClass() .removeClass() .toggleClass() .hasClass() DOM属性(上) .addClass() 为每个匹配的元素添加指定的样式类名 值得注意的是这个方法不会替换一个样式类名.它只是简单的添加一个样式类名到元素上. 对所有匹配的元素可以一次添加多个用空格隔开的样式类名, 像这样: $("p").addClass("myClass yourClass"); .addClass() 方法允许我们

  • vue 中的 render 函数作用详解

    render 函数作用 vue渲染函数文档第一遍看的晕晕乎乎的,再看看写写终于清晰了.建议配合文档阅读,本文也是根据文档加上自己的理解. 注:本文代码都是在单文件组件中编写.代码地址 render 函数作用 render 函数 跟 template 一样都是创建 html 模板的,但是有些场景中用 template 实现起来代码冗长繁琐而且有大量重复,这时候就可以用 render 函数. 官网例子:子组件想要根据父组件传递的 level 值(1-6)来决定渲染标签 h 几.具体代码可以看文档.

  • 关于Js中new操作符的作用详解

    关于Js中new操作符的作用详解

    前言 Js是当今时代最常用的代码操作语言,其中new操作符尤为常见.对于很多代码小白来说,并不清楚new在Js中扮演着怎样的角色,具体是做什么用,干了什么.本文从new操作符的作用着手,简单介绍new操作符相关知识. 什么是new? 众所周知,在JS中,new的作用是通过构造函数来创建一个实例对象. 像下面这样:(和普通函数不一样,当函数用作构造函数时,首字母一般要大写,以作区分.) function Foo(name) { this.name = name; } console.log("ne

  • Python中property属性的用处详解

    目录 前言 限制值 使用 @property 的方式代替. 动态属性的好处 动态显示 附:用property代替getter和setter方法 总结 前言 Python 动态属性的概念可能会被面试问到,在项目当中也非常实用,但是在一般的编程教程中不会提到,可以进修一下. 先看一个简单的例子.创建一个 Student 类,我希望通过实例来获取每个学生的一些情况,包括名字,成绩等.成绩只有等到考试结束以后才会有,所以实例化的时候不会给它赋值. class Student: def __init__(

  • shell中各种括号的作用详解()、(())、[]、[[]]、{}(推荐)

    一.小括号,圆括号() 1.单小括号 () ①命令组.括号中的命令将会新开一个子shell顺序执行,所以括号中的变量不能够被脚本余下的部分使用.括号中多个命令之间用分号隔开,最后一个命令可以没有分号,各命令和括号之间不必有空格. ②命令替换.等同于`cmd`,shell扫描一遍命令行,发现了$(cmd)结构,便将$(cmd)中的cmd执行一次,得到其标准输出,再将此输出放到原来命令.有些shell不支持,如tcsh. ③用于初始化数组.如:array=(a b c d) 2.双小括号 (( ))

  • python中的属性管理机制详解

    python中的属性管理机制详解

    目录 一.私有属性 二.属性限制-__slots__方法 三.python中如何去声明变量 四.python中的有关属性 一.私有属性 Python并没有真正的私有化支持,但可用下划线得到伪私有,有一项大多数 Python 代码都遵循的习惯:带有下划线,前缀的名称应被视为非公开的 API 的一部分(无论是函数. 方法还是数据 成员) python中私有并没有实现真正的私有,只是在保存属性的时候改了个名字,在外部无法直接方法 私有属性具体表现为: _参数名 : 声明式私有属性 __参数名 : _类

随机推荐