House for developing and using freshes components.
Last updated a year ago by xiati .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install @roto/pack 
SYNC missed versions from official npm registry.



yarn add -D @freshes/house


Core files of house have:

  • src/Runners/DevelopmentRunner.js, to start development environment.
  • src/Runners/ProductionRunner.js, to build production environment.
  • src/Runners/ServerRunner.js, after building production, it will start a Express to set proxy and open web page for preview.


Add new file ./script/development.js in project root path.

// ./script/development.js
import DevelopmentRunner from '@freshes/house/src/Runners/DevelopmentRunner.js'

new DevelopmentRunner()
  // set proxy map by http-proxy-middleware
  // set app browser env by webpack.DefinePlugin
  // extend webpack or express
  .extend(runner => {})
  // Finally run

Then edit ./package.json

  "scripts": {
    "start": "node ./scripts/development.js"

About runner.extend

runner has two built-in builder, they are webpackBuilder and expressBuilder.

new DevelopmentRunner().extend(runner => {
  // you can refer to api documentation, the documentation will be uploaded

Sentry Hash

新增 VERSION_HASH 的环境的变量,默认取当前 git commit 的 hash 值。

webpack externals

新增webpack externals

externals: {
  vue: 'Vue',
  vuex: 'Vuex',
  'vue-router': 'VueRouter'

webpack 不会打包 external中的类库, 减少js bundle 体积 当你使用 import Vue from 'vue' 时, webpack会引入window.vue, 所以必须在template 即index.html中引入相关cdn example

  <script src=//static.34580.cn/cn/public/vue/2.5.3/vue.min.js></script>
  <script src=//static.34580.cn/cn/public/vue-router/3.0.0/vue-router.min.js></script>
  <script src=//static.34580.cn/cn/public/vuex/3.0.0/vuex.min.js></script>

使用externals 方法:

  1. 升级house yarn add @freshes/house@next

  2. 扩展runnerextend方法

const ProductionRunner = require('@freshes/house/src/Runners/ProductionRunner')

new ProductionRunner()
    NODE_ENV: 'production'
  .extend(runner => {
    const config = runner.webpackBuilder.create() // webpack config
    const externals = {
      vue: 'Vue',
      vuex: 'Vuex',
      'vue-router': 'VueRouter'
    config.externals = externals

Current Tags

  • 1.0.1                                ...           latest (a year ago)

2 Versions

  • 1.0.1                                ...           a year ago
  • 1.0.0                                ...           a year ago
Maintainers (1)
Today 0
This Week 3
This Month 3
Last Day 0
Last Week 0
Last Month 0
Dev Dependencies (4)
Dependents (0)

Copyright 2014 - 2017 © taobao.org |