Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

现在用dva开发build出来的目标文件非常大(1.3M),不知如何缩小包的大小? #391

Closed
nilyang opened this issue Dec 13, 2016 · 5 comments
Labels

Comments

@nilyang
Copy link

nilyang commented Dec 13, 2016

您好!

我最近在使用dva做开发,很感谢dva作者们的努力~
目前我遇到的问题是,项目文件并不是很多,但是打包出来之后的package非常大(index.js 达到1.3MB了)。不知道dva构建能否支持将项目拆分成多个入口,按功能拆分页面呢?

@nikogu
Copy link
Member

nikogu commented Dec 13, 2016

贴一下你的 package.json

@nilyang
Copy link
Author

nilyang commented Dec 13, 2016

@nikogu 下面是我的package.json

 {
  "private": true,
  "entry": {
    "index": "./src/index.js"
  },
  "peerDependencies": {
  },
  "dependencies": {
    "antd": "^2.4.3",
    "dva": "^1.1.0",
    "echarts": "^3.3.1",
    "echarts-for-react": "^1.1.6",
    "moment-timezone": "^0.5.10",
    "path-to-regexp": "^1.7.0",
    "qs": "^6.3.0",
    "react": "^15.3.2",
    "react-dom": "^15.3.2",
    "reqwest": "^2.0.5"
  },
  "devDependencies": {
    "atool-build": "^0.9.0",
    "atool-test-mocha": "^0.1.5",
    "babel-plugin-dev-expression": "^0.2.1",
    "babel-plugin-dva-hmr": "^0.2.0",
    "babel-plugin-import": "^1.1.0",
    "babel-plugin-transform-runtime": "^6.9.0",
    "babel-runtime": "^6.9.2",
    "dora": "^0.4.3",
    "dora-plugin-proxy": "^0.8.4",
    "dora-plugin-webpack": "^0.8.1",
    "dora-plugin-webpack-hmr": "^0.2.1",
    "expect": "^1.20.2",
    "redbox-react": "^1.3.2"
  },
  "scripts": {
    "start": "dora --plugins \"proxy?watchDirs=./mock,webpack?port=8000,webpack-hmr\"",
    "build": "atool-build",
    "test": "atool-test-mocha ./src/**/*-test.js"
  }
}

项目是我用 dvacli 创建的

dva new myproject

@codering
Copy link
Contributor

echarts已经很大了

@nilyang
Copy link
Author

nilyang commented Dec 14, 2016

@codering echarts3 官网说的压缩后是170k多,如果能分离就好了,不知道有没有方法?

@codering
Copy link
Contributor

codering commented Dec 14, 2016

可以按需引入对应的模块,比如只用折线图柱状图饼图, 引入如下:

// ==== 以下必须引入 ====
// core
import echarts from 'echarts/lib/echarts'
// for ie8
//import 'zrender/lib/vml/vml'
// 柱状图
import 'echarts/lib/chart/bar'
// 折线图
import 'echarts/lib/chart/line'
// 饼图
import 'echarts/lib/chart/pie'

// ==== 以下不引入也可以,只是没效果,也不会报错 ====
// tooltip
import 'echarts/lib/component/tooltip'
// legend
import 'echarts/lib/component/legend'
// title
import 'echarts/lib/component/title'


echarts.init(...)

比较烦的是,这些模块并不是强依赖关系,会发现有些模块没引入就没效果,而有些模块会则在渲染时有错误提示,要求引入指定模块.

当然写个babel插件估计好处理些。。。。。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

4 participants