账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    Vue + element-ui 打包生成的js文件这么大正常吗?
    53
    0

    package.json 文件内容:

    {
      "name": "wingspage",
      "version": "0.1.0",
      "private": true,
      "scripts": {
        "serve": "vue-cli-service serve",
        "build": "vue-cli-service build",
        "lint": "vue-cli-service lint"
      },
      "dependencies": {
        "axios": "^0.18.0",
        "element-ui": "^2.4.11",
        "lodash": "^4.17.11",
        "vue": "^2.5.17",
        "vue-router": "^3.0.1"
      },
      "devDependencies": {
        "@vue/cli-plugin-babel": "^3.2.0",
        "@vue/cli-plugin-eslint": "^3.2.0",
        "@vue/cli-service": "^3.2.0",
        "babel-eslint": "^10.0.1",
        "eslint": "^5.8.0",
        "eslint-plugin-vue": "^5.0.0-0",
        "vue-template-compiler": "^2.5.17"
      }
    }
    

    npm run build打包输出:

    > wingspage@0.1.0 build D:\GOPATH\src\WingsGo\page
    > vue-cli-service build
    
    
    -  Building for production...
    
     WARNING  Compiled with 2 warnings                                                                                                                         14:55:14
     warning
    
    asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
    This can impact web performance.
    Assets:
      js/chunk-vendors.40fc56d8.js (746 KiB)
    
     warning
    
    entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
    Entrypoints:
      app (959 KiB)
          css/chunk-vendors.9c8e3772.css
          js/chunk-vendors.40fc56d8.js
          css/app.d188071d.css
          js/app.314fa8ec.js
    
    
      File                                    Size              Gzipped
    
      dist\js\chunk-vendors.40fc56d8.js       745.90 kb         191.94 kb
      dist\js\app.314fa8ec.js                 18.14 kb          6.09 kb
      dist\js\chunk-3853daff.7c85ec3e.js      0.68 kb           0.44 kb
      dist\js\chunk-26ad2470.57300bb8.js      0.68 kb           0.44 kb
      dist\css\chunk-vendors.9c8e3772.css     194.50 kb         29.45 kb
      dist\css\app.d188071d.css               0.04 kb           0.06 kb
      dist\css\chunk-26ad2470.739f8c92.css    0.00 kb           0.02 kb
      dist\css\chunk-3853daff.739f8c92.css    0.00 kb           0.02 kb
    
      Images and other types of assets omitted.
    
     DONE  Build complete. The dist directory is ready to be deployed.
     INFO  Check out deployment instructions at https://cli.vuejs.org/guide/deployment.html

    页面功能逻辑很简单,引用组件也不多,由于js太大,打开页面比较慢(相比jquery的同等实现),前端不太熟,是不是我哪里配置不对?

    0
    打赏
    收藏
    点击回答
    您的回答被采纳后将获得:提问者悬赏的 10 元积分
        全部回答
    • 0
    • じ☆糊涂的 普通会员 1楼

      Vue + Element-UI 包装生成的 JavaScript 文件的大小可能会因为项目规模、使用的代码、编译器等因素而有所不同。一般来说,打包后的 JavaScript 文件应该比未压缩的版本小,因为压缩可以减少文件大小。

      对于 Vue + Element-UI 的开发项目,通常会使用 webpackRollup 这样的工具进行打包。这些工具会对项目中的代码进行编译,并将多个模块打包成一个.js文件,从而减少文件大小。

      此外,如果你的项目使用了ES6的语法特性,或者使用了库或框架,可能会对代码的编译产生影响,导致文件大小增大。在这种情况下,可以尝试使用一些工具,如 es6-promiseterser 等,来提高代码的编译效率。

      总的来说,Vue + Element-UI 打包生成的 JavaScript 文件的大小会因为项目规模、使用的代码、编译器等因素而有所不同,但通常来说,打包后的文件应该比未压缩的版本小。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部