umijs/umi

A framework in react community ✨

umi's Issues

Reconnect tip with why

umi-test jsTranformer not exported properly? (TypeError: Jest: a transform must export a `process` function.)

I get jest-runtime errors

 FAIL  src/components/Authorized/CheckPermissions.test.js
   Test suite failed to run

    TypeError: Jest: a transform must export a `process` function.

      at ScriptTransformer._getTransformer (node_modules/jest-runtime/build/script_transformer.js:152:15)
          at Generator.next (<anonymous>)

This issue doesn't exist in 0.3.0 only in 0.3.1
Please see ant-design/ant-design-pro#776 for more information

umi roadmap

1.0

• PWA
• Improve router, #26
• website
• Comb configuration items

1.x

• Improve lighthouse score
• Plugin system
• umi-plugin-dva

Support hd solution with `hd: true`

• hd.js
• antd-mobile config, ref
• pxtorem

Multiple language, support en and zh-cn

• Default en
• Use other lang with ENV variable, e.g. UMI_LANG=zh-cn umi dev

More webpack configs

Todos

• sass
• enableCSSModules -> disableCSSModules
• devtool (e.g. enable sourcemap in production)

Configs don't support

• extraBabelPresets and extraBabelPlugins (use babel instead)
• multipage
• autoprefixer ( use browsers instead)
• dllPlugin
• svgSpriteLoaderDirs
• library
• libraryTarget
• cssModulesExclude

Config changes

• entry

New Configs

• babel
• copy
• commons
• browserslist
• extraResolveModules

Watch webpack.config.js's change, and reload webpack

Use user's antd or and-mobile if it's found in user's package.json

Add monitor to track umi's version, config.js, webpack.config.js, ...

jest@22

• http://facebook.github.io/jest/blog/2017/12/18/jest-22.html

Fix occasionally Compiling... problem

Improve umi/dynamic, support config loading component

umi/dynamic 改进

原来的方式：

dynamic(resolve);

支持传入 loading 组件：

dynamic(resolve, {
  loading,
});

支持配置 page 加载时的 LoadingComponent

在 config.js 中，配置 loading 指向返回 LoadComponent 的文件。

{
  "loading": "./PageLoadingComponent"
}

Support don't pack router code by config

$ ROUTER=none umi build

Sourcemap don't work perfectly, jsx transform is not restored

some file need babel

"node_modules/af-webpack/lib",
"node_modules/umi-build-dev"

Built-in preact and react, react by default, and support config to use preact

routerBase is wrong when have directory page component

Built-in antd

Support specify plugins in dev and build

# Normal usage
$ umi build --plugins path/to/plugin.js

# Multiple plugins
$ umi build --plugins path/to/plugin1.js,path/to/plugin2.js

This will merge with plugins in config.js.

define属性指定process.env.contextPath问题

"define": { "process.env.contextPath": process.env.contextPath, }

这样定义出错，请问这样的方式怎样指定process.env中的值？

Support config disableDynamicImport

ant-design/ant-design-pro#470

umi-test failed

Emit a global event when Page Component is initialized

emit({ type: 'pageInitialized' });

Support umi dev in https

autoprefixer： flexbox能不能自定义？

umi/packages/af-webpack/src/getConfig.js

Line 42 in 9799a86

flexbox: 'no-2009',

HashedModuleIdsPlugin

sorrycc/roadhog#510

Support typescript

• af-webpack 支持 typescript 构建
• page component 支持以 .ts, .tsx 结尾的入口文件
• 声明，@zhang740

Support don't generate HTML files

$ HTML=none umi build

webpack-pwa-manifest

• https://www.npmjs.com/package/webpack-pwa-manifest
• https://developers.google.com/web/fundamentals/web-app-manifest/

umi/Link, umi/router can't trigger state change with dva.

<Link to="xx">link</Link>

or

router.push('/path')

can change url and route to new page, but can't trigger state change in umi+dva project.

Subscription and life-circle method like componentWillReceiveProps will not run.

Support use config.pagesGlobPattern to find page files

production 模式下默认压缩 css

ant-design/ant-design-pro#313

Support disable dynamic load

Internal requirement, not recommend, don't use it.

$ PRIVATE_DISABLE_DYNAMIC=1 umi build

Generate css for every single page

Lint ts files with tslint

Minify html with htmlnano in production mode

• https://github.com/kangax/html-minifier
• https://github.com/posthtml/htmlnano

Support use env DISABLE_CLEAR_CONSOLE=1 to disable console clear

Live theme support hmr

• https://github.com/yesmeck/webpack-less-theme-plugin
• https://github.com/mzohaibqc/antd-live-theme
• https://github.com/mzohaibqc/antd-theme-webpack-plugin

af-webpack的readme文档文案错误

在项目中的文件路径：umi/packages/af-webpack/
文案定位： API - af-webpack/dev - Options 第四条 beforeServer 应为 afterServer

Disable @babel/register's cache

<Link><FormattedMessage /></Link> doesn't work.

<Link to="/test-page" className={styles.test}>
  <FormattedMessage id="lang.message" />
</Link>

will generate the following HTML, can't click.

<span>some message</span>

<Link to="/test-page" className={styles.test}>
  <span>some message</span>
</Link>

will generate the same HTML as in (1.), it can be clicked, but with no pointer cursor.

<Link to="/test-page" className={styles.test}>
  <a><FormattedMessage id="lang.message" /></a>
</Link>

this works fine.

I think it's a bug.

Another thing, Link only accept one child, the following code will throw an exception.

<Link to='xxx'>
  <Icon class=''/> Message
</Link>

Improve eslint

• print error when .eslintrc JSON parse failed
• reload dev server when .eslintrc is modified

Support config vendor

sorrycc/roadhog#370

Improve router

• use react-router-dom
• support props.query
• support variable path (consider static generate)
• support global layout

Config parameters in route '/search/person/:query/:n'

I can create page file pages/search/person.js to match /search/person.html
Can I put parameters in url?
/search/person/:query/:n

I did this before with react-rotuer:

  User: {
    path: '/user/:id',
    models: () => [import('models/user/detail')],
    component: () => import('./detail/'),
  },   

Cannot customize HOST from env

umi/packages/af-webpack/src/dev.js

Line 16 in 9a8ea3f

const HOST = '0.0.0.0';

Seems that variable HOST is hard-coded here.
To my understanding, roadhog 2+ depends on this and the doc of which indicates HOST can be customized.
How about change it to:

const HOST = process.env.HOST || '0.0.0.0'

How to share model's data between pages in umi + dva-no-router.

I am refactoring my project using umi.
As shown In this example https://github.com/umijs/umi/tree/master/examples/with-dva

Each page has a new instance of dva, Is this the right way to use dva in umi?
If so, models can't share it's data between pages. but I want to share data just like before in dva with react-router@4.

What's the best way to use dva-no-router in umi?

umi-test with jest

<Link to="/" ></Link> should be jump to '/', not '.html'

use `.${libraryName}-${env}` as tmp directory

Two problems:

1. window has permission problem when a folder was used by multiple process
2. dev will show "white screen" when build in run