希望能进行资源分析 #61

poi-mashiro · 2019-01-09T10:24:58Z

在 createBaseConfig.js 中修改了以下内容

const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

    optimization: {
      runtimeChunk: {
        name: 'runtime'
      },
      splitChunks: {
        chunks: 'all',  // 增加了这行
        

     // plugins 中增加
      new BundleAnalyzerPlugin({
        analyzerMode: 'static',
        reportFilename: '../dist/report.html',
        openAnalyzer: false,
      })

其他资源使用官方demo 也能达到同样效果

问题现象

略微修改官方 megalo-yanxuan-demo 后的结果

没有预期的
项目比较大，想在 dev mode 下手机能预览，比较介意个资源的大小
版本

"devDependencies": {
    "@megalo/entry": "^0.1.1",
    "@megalo/px2rpx-loader": "^0.1.1",
    "@megalo/target": "^0.5.5",
    "@megalo/template-compiler": "^0.7.0",
    "@vue/eslint-config-prettier": "^4.0.1",
    "babel-core": "6",
    "babel-eslint": "^10.0.1",
    "babel-loader": "^7.1.5",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-stage-0": "^6.24.1",
    "copy-webpack-plugin": "^4.5.2",
    "css-loader": "^1.0.0",
    "eslint": "^5.10.0",
    "eslint-config-prettier": "^3.3.0",
    "eslint-config-standard": "^12.0.0",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-node": "^8.0.0",
    "eslint-plugin-prettier": "^3.0.0",
    "eslint-plugin-promise": "^4.0.1",
    "eslint-plugin-standard": "^4.0.0",
    "eslint-plugin-vue": "^5.0.0",
    "html-webpack-plugin": "^3.2.0",
    "mini-css-extract-plugin": "^0.4.1",
    "stylus": "^0.54.5",
    "stylus-loader": "^3.0.2",
    "vue-loader": "15.4.0",
    "vue-style-loader": "^4.1.1",
    "vuex": "^3.0.1",
    "webpack": "^4.16.5",
    "webpack-bundle-analyzer": "^3.0.3",
    "webpack-cli": "^3.1.0",
    "webpack-dev-server": "^3.1.5"
  },
  "dependencies": {
    "@megalo/vhtml-plugin": "^0.1.2",
    "lodash": "^4.17.11",
    "megalo": "^0.7.0",
    "octoparse": "^0.3.2"
  }

操作系统信息
macos mojave 10.14.1(18B75)

bigmeow · 2019-04-02T08:04:10Z

用法：megalo-cli-service build [options] [entry|pattern]

选项：
  --platform    指定要编译的平台 (默认值: wechat), 可选值: wechat、alipay、swan、tt、h5,其中 tt 和 h5 目前还未得到支持
  --mode        指定环境模式 (默认值：production)
  --report      生成 report.html 以帮助分析包内容
  --report-json 生成 report.json 以帮助分析包内容

@poi-mashiro

poi-mashiro · 2019-04-02T09:59:54Z

还在试老cli的项目新 cli 各种内存溢出内存申请不被允许

bigmeow · 2019-04-02T10:02:57Z

内存溢出？详细描述下报错之类的

poi-mashiro · 2019-04-02T10:38:16Z

首先最新版报了

(node:19590) UnhandledPromiseRejectionWarning: Error: Cannot find module 'webpack/lib/RuleSet'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:580:15)
    at Function.Module._load (internal/modules/cjs/loader.js:506:25)
    at Module.require (internal/modules/cjs/loader.js:636:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at Object.<anonymous> (/Volumes/code/***/node_modules/vue-loader/lib/plugin.js:2:17)
    at Module._compile (internal/modules/cjs/loader.js:688:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10)
    at Module.load (internal/modules/cjs/loader.js:598:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
    at Function.Module._load (internal/modules/cjs/loader.js:529:3)
(node:19590) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:19590) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

通过降低 webpack 版本解决了

然后就是内存溢出

using @megalo/[email protected]
using [email protected]
configureWebpack执行了
 63% building 514/574 modules 60 active ...code/***/src/components/CommonPath.vue
<--- Last few GCs --->

[19935:0x102803000]    44550 ms: Mark-sweep 1227.0 (1455.0) -> 1216.3 (1456.5) MB, 137.1 / 0.0 ms  (average mu = 0.269, current mu = 0.237) allocation failure scavenge might not succeed
[19935:0x102803000]    44727 ms: Mark-sweep 1228.9 (1456.5) -> 1218.3 (1456.5) MB, 137.2 / 0.0 ms  (average mu = 0.246, current mu = 0.223) allocation failure scavenge might not succeed


<--- JS stacktrace --->

==== JS stack trace =========================================

    0: ExitFrame [pc: 0x2af34badbe3d]
Security context: 0x2cb08909e6e1 <JSObject>
    1: DoJoin(aka DoJoin) [0x2cb089085e89] [native array.js:~87] [pc=0x2af34c68a6e9](this=0x2cb08a9826f1 <undefined>,l=0x2cb0f89ab779 <JSArray[2]>,m=2,A=0x2cb08a9828c9 <true>,w=0x2cb03e5b1f81 <String[1]\: \n>,v=0x2cb08a9829a1 <false>)
    2: Join(aka Join) [0x2cb089085ed9] [native array.js:~112] [pc=0x2af34bb67e38](this=0x2cb08a9826f1 <undefined>,l=0x2cb0f89...

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
 1: 0x100037818 node::Abort() [/opt/local/bin/node]
 2: 0x1000379e9 node::OnFatalError(char const*, char const*) [/opt/local/bin/node]
 3: 0x10016c863 v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [/opt/local/bin/node]
 4: 0x10016c804 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/opt/local/bin/node]
 5: 0x10041d464 v8::internal::Heap::UpdateSurvivalStatistics(int) [/opt/local/bin/node]
 6: 0x10041f033 v8::internal::Heap::CheckIneffectiveMarkCompact(unsigned long, double) [/opt/local/bin/node]
 7: 0x10041c76f v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [/opt/local/bin/node]
 8: 0x10041b5ba v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/opt/local/bin/node]
 9: 0x100423a9b v8::internal::Heap::AllocateRawWithLigthRetry(int, v8::internal::AllocationSpace, v8::internal::AllocationAlignment) [/opt/local/bin/node]
10: 0x100423da8 v8::internal::Heap::AllocateRawWithRetryOrFail(int, v8::internal::AllocationSpace, v8::internal::AllocationAlignment) [/opt/local/bin/node]
11: 0x1004040c7 v8::internal::Factory::AllocateRawWithImmortalMap(int, v8::internal::PretenureFlag, v8::internal::Map*, v8::internal::AllocationAlignment) [/opt/local/bin/node]
12: 0x1004059a3 v8::internal::Factory::NewRawTwoByteString(int, v8::internal::PretenureFlag) [/opt/local/bin/node]
13: 0x100623a2f v8::internal::Runtime_StringBuilderJoin(int, v8::internal::Object**, v8::internal::Isolate*) [/opt/local/bin/node]
14: 0x2af34badbe3d 
Abort trap: 6

修改 cli server 里的 bin/index.js 第一行后面 --max_old_space_size=5120 强制划分 5G 内存

又报了

configureWebpack执行了
 88% hashingnode(20335,0x1049e45c0) malloc: can't allocate region                 
*** mach_vm_map(size=18446744071971930112) failed (error code=3)
node(20335,0x1049e45c0) malloc: *** set a breakpoint in malloc_error_break to debug
node(20335,0x1049e45c0) malloc: can't allocate region
*** mach_vm_map(size=18446744071971930112) failed (error code=3)
node(20335,0x1049e45c0) malloc: *** set a breakpoint in malloc_error_break to debug
node[20335]: ../src/util-inl.h:377:T *node::Realloc(T *, size_t) [T = char]: Assertion `!(n > 0) || (ret != nullptr)' failed.
 1: 0x100037818 node::Abort() [/opt/local/bin/node]
 2: 0x100036952 node::AddEnvironmentCleanupHook(v8::Isolate*, void (*)(void*), void*) [/opt/local/bin/node]
 3: 0x1001092d1 node::MaybeStackBuffer<char, 1024ul>::AllocateSufficientStorage(unsigned long) [/opt/local/bin/node]
 4: 0x1000fbc4a node::StringBytes::InlineDecoder::Decode(node::Environment*, v8::Local<v8::String>, v8::Local<v8::Value>, node::encoding) [/opt/local/bin/node]
 5: 0x1000fcc88 node::crypto::Hash::HashUpdate(v8::FunctionCallbackInfo<v8::Value> const&) [/opt/local/bin/node]
 6: 0x1001cf164 v8::internal::FunctionCallbackArguments::Call(v8::internal::CallHandlerInfo*) [/opt/local/bin/node]
 7: 0x1001ce796 v8::internal::MaybeHandle<v8::internal::Object> v8::internal::(anonymous namespace)::HandleApiCallHelper<false>(v8::internal::Isolate*, v8::internal::Handle<v8::internal::HeapObject>, v8::internal::Handle<v8::internal::HeapObject>, v8::internal::Handle<v8::internal::FunctionTemplateInfo>, v8::internal::Handle<v8::internal::Object>, v8::internal::BuiltinArguments) [/opt/local/bin/node]
 8: 0x1001cdf28 v8::internal::Builtin_Impl_HandleApiCall(v8::internal::BuiltinArguments, v8::internal::Isolate*) [/opt/local/bin/node]
 9: 0x22819e65be3d 
Abort trap: 6

然后我就修改小程序配置先忽略了20个左右的页面之后终于build出来了但是感觉没有达到分析资源的目的

这个vendor.js 至少包含了我本地的

共36kb
但是从结果上看不出

bigmeow · 2019-04-02T14:44:57Z

这得多少个页面和组件来着。。。

poi-mashiro · 2019-04-03T01:48:55Z

大概30个页面 5，6个组件，老版的build目录的从来没有过内存溢出，就是 cli serve 一直有这个问题

bigmeow · 2019-04-03T01:59:10Z

嗯，我开个分支优化下代码结构。
方便帖下你的电脑配置吗

poi-mashiro · 2019-04-03T02:00:59Z

硬盘是256g ssd

bigmeow · 2019-07-05T08:03:08Z

@poi-mashiro 可能解决了，你把eslint关掉测试一下

poi-mashiro · 2019-07-05T08:18:35Z

刚刚 npm update 了一下之后试了一下提示装 @megalo/cli-plugin-eslint 说明老的 eslint 失效了然后build 成功了，再装上新的又报 JavaScript heap out of memory 看来确实是 eslint 的问题

megalo 官网的更新日志好久没变我还以为你们弃坑了

什么时候资源分析的结果才能像 web 那样

bigmeow · 2019-07-05T08:25:11Z

{
  "scripts": {
      "report": "megalo-cli-service build --report"
  }
}

https://megalojs.org/#/cli/cli-service?id=megalo-cli-service-build

这个资源分析不行么

poi-mashiro · 2019-07-05T08:28:12Z

没有一个大的 js 文件里面包含了哪些小 js 的结果只有小程序对应页面的 js 文件的一个个方块公共文件的 chunk 也是一个个方块没有里面包含了什么

�而且分包的话没有分包页面的 js 文件的方块

bigmeow · 2019-07-05T08:47:16Z

有的啊，你点左上角切换下 stat

对，分包的的确没有，这个估计是个bug
@fengzilong

poi-mashiro · 2019-07-05T08:57:13Z

普通网页项目的 stat parsed gzipped 都能看包含内容大小，小程序没办法么我比较关心 parsed 后的

bigmeow · 2019-07-05T09:00:37Z

也可以啊，你双击一下想看的模块，不就可以看了么。。。
当然只能看js的，其他的不支持

poi-mashiro · 2019-07-05T09:02:15Z

行吧可以 close 了

fengzilong transferred this issue from kaola-fed/megalo Jan 10, 2019

fengzilong added the Type: Enhancement label Jan 17, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

希望能进行资源分析 #61

希望能进行资源分析 #61

poi-mashiro commented Jan 9, 2019

bigmeow commented Apr 2, 2019

poi-mashiro commented Apr 2, 2019

bigmeow commented Apr 2, 2019

poi-mashiro commented Apr 2, 2019

bigmeow commented Apr 2, 2019

poi-mashiro commented Apr 3, 2019

bigmeow commented Apr 3, 2019 •

edited

Loading

poi-mashiro commented Apr 3, 2019

bigmeow commented Jul 5, 2019

poi-mashiro commented Jul 5, 2019

bigmeow commented Jul 5, 2019 •

edited

Loading

poi-mashiro commented Jul 5, 2019 •

edited

Loading

bigmeow commented Jul 5, 2019 •

edited

Loading

poi-mashiro commented Jul 5, 2019 •

edited

Loading

bigmeow commented Jul 5, 2019 •

edited

Loading

poi-mashiro commented Jul 5, 2019

希望能进行资源分析 #61

希望能进行资源分析 #61

Comments

poi-mashiro commented Jan 9, 2019

bigmeow commented Apr 2, 2019

poi-mashiro commented Apr 2, 2019

bigmeow commented Apr 2, 2019

poi-mashiro commented Apr 2, 2019

bigmeow commented Apr 2, 2019

poi-mashiro commented Apr 3, 2019

bigmeow commented Apr 3, 2019 • edited Loading

poi-mashiro commented Apr 3, 2019

bigmeow commented Jul 5, 2019

poi-mashiro commented Jul 5, 2019

bigmeow commented Jul 5, 2019 • edited Loading

poi-mashiro commented Jul 5, 2019 • edited Loading

bigmeow commented Jul 5, 2019 • edited Loading

poi-mashiro commented Jul 5, 2019 • edited Loading

bigmeow commented Jul 5, 2019 • edited Loading

poi-mashiro commented Jul 5, 2019

bigmeow commented Apr 3, 2019 •

edited

Loading

bigmeow commented Jul 5, 2019 •

edited

Loading

poi-mashiro commented Jul 5, 2019 •

edited

Loading

bigmeow commented Jul 5, 2019 •

edited

Loading

poi-mashiro commented Jul 5, 2019 •

edited

Loading

bigmeow commented Jul 5, 2019 •

edited

Loading