Backpack是Node.js项目的简约的构建系统_前端开发者

www.rokub.com
背包背包状态npm版本在Slack上加入聊天Backpack是node.js的简约构建系统。受到Facebook的create-react-app,Zeit的Next.js和Remy的Nodemon启发,Backpack允许您创建具有零配置的现代node.js应用程序和服务。背包处理所有的文件观看,实时重新加载,转发和捆绑,所以你不必这样做。它带有一些公约(如支持最新的JavaScript awesomeness(即异步/等待,对象休息传播和类属性)),但所有内容都可以自定义以适合您的项目需求。最重要的是,您可以轻松地将Backpack添加到现有的node.js项目中,只需一个依赖项即可。

背包随附“电池包”:

  • 最新的ES6功能(包括模块语法,异步/等待,对象休息传播)
  • SUPER友好的,人类可读的错误消息
  • 实时重新加载(保存,添加/删除文件等)
  • 零配置,一个依赖。

但是,您可以通过扩展底层Webpack 2配置来配置Backpack以满足项目需求。

仔细阅读:如果您正在考虑使用带有React.js的背包,则应该使用Razzle。这是一个专门为SSR React构建的项目,具有几乎相同的API。

目录

  • 如何使用
    • 自定义配置
    • 定制webpack配置
    • 定制babel配置
    • 建设生产
  • CLI命令
    • backpack dev
    • backpack build
  • 常问问题
  • 灵感
  • 作者

如何使用

安装它:

并像下面这样将一个脚本添加到你的package.json中:

{
    scripts :{
      dev  backpack 
  }
}

之后,只有几个 公约默认值:

  • src/index.js:您的应用程序的输入。

…其实就是这样。

然后你可以在开发模式下运行你的应用程序:

成功的构建将显示这样的控制台。注意:从运行基本示例获取的屏幕截图npm运行开发

自定义配置

对于自定义高级行为,您可以backpack.config.js在项目目录的根目录(旁边package.json)中创建一个。

// backpack.config.js 
//重要提示:此文件未经过babel转换。
//然而,您可以使用node.js版本支持的ES2015功能。
模块exports  = {
   / * config options here * / 
}

定制webpack配置

前端开发者丨Node.js

www.rokub.com

要扩展webpack,你可以定义一个通过扩展它的配置的函数backpack.config.js

// backpack.config.js 
模块exports  = {
   webpack  config options webpack => {
     //执行自定义配置
    //重要:返回修改后的配置
    返回配置
  }
}

定制babel配置

为了扩展我们的用法babel,您可以.babelrc在应用程序的根目录下定义一个文件。该文件是可选的。

如果找到,Backpack会认为它是真相来源。因此它必须定义背包需要什么,这是backpack-core/babel预设。

这是为了让您对我们对默认babel配置所做的修改不感到惊讶。

这是一个示例.babelrc文件:

{
    presets  [
     背包核心/巴贝尔阶段0 
  ]
}

注意:这与Next.js完全一样。

建设生产

为构建步骤添加一个npm脚本:

{
    scripts :{
      dev  backpack  build  backpack build 
  }
}

然后运行build命令并启动你的应用程序

npm运行构建
节点./build/main.js

CLI命令

backpack dev

以开发模式运行背包。

如果您进行编辑,您的代码将重新加载。
您会看到控制台中的构建错误,如下所示。

背包开发

backpack build

构建应用程序以生产build文件夹。
它正确捆绑您的生产模式并优化构建以获得最佳性能。

您可以使用以下命令运行您的生产应用程序:

您的应用程序已准备好部署!

注意:确保将build目录添加到您的目录中,.gitignore以便将编译后的代码保存在您的git存储库中

常问问题

这就像Create-React-App或Next.js一样吗?
我可以在React中使用它来构建通用应用程序吗?
什么句法特征被转译?我如何改变它们?
为什么叫背包?

灵感

  • jlong​​ster /后端与 – 的WebPack
  • 纽约时报/ KYT
  • 时代周报/ next.js
  • facebookincubator /创建反应的应用内

作者

  • 贾里德帕尔默(@jaredpalmer) – 帕尔默集团

原文:https://github.com/jaredpalmer/backpack

www.rokub.com

» 本文来自:前端开发者 » 《Backpack是Node.js项目的简约的构建系统_前端开发者》
» 本文链接地址:https://www.rokub.com/179.html
» 您也可以订阅本站:https://www.rokub.com
赞(0)
64K

评论 抢沙发

评论前必须登录!