antd按需加载为什么仍然很大?

按照推荐的按需加载:

{
  "presets": [
    "env",
    "react",
    "stage-0"
  ],
  "plugins": [
    [
      "import", {
        "libraryName": "antd",
        "libraryDirectory": "es",
         "style": true
      }
    ]
  ]
}
    

引入input:

import {Input} from 'antd'

parcel后整个js有1.7M左右(未打包压缩,parcel xx --no-source-maps),react,react-dom已经提前分离出来,仅仅只引入了input组件,无其他组件,请问这样正常吗?为什么这么大?使用的是parcel.

package.json:

{
  "name": "parcel",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "parcel watch index.html --no-source-maps",
    "build": "parcel build index.html"
  },
  "author": "",
  "license": "",
  "devDependencies": {
    "autoprefixer": "^9.4.2",
    "babel-core": "^6.26.3",
    "babel-plugin-import": "^1.11.0",
    "babel-polyfill": "^6.26.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "less": "^2.7.3"
  },
  "dependencies": {
    "antd": "^3.13.2",
    "react": "^16.6.3",
    "react-dom": "^16.6.3"
  }
}

代码:

//import React from "react"; 外部umd引入
//import ReactDOM from "react-dom";外部umd引入

import './index.less'
import {Input}from 'antd';  

  class App extends React.Component {
     render() {
        return (
            <div>
             <div className='p'>Home</div>
             <div>About</div>
            <Input/>
            </div>
            )    
     }
}
var app = document.getElementById("app")
ReactDOM.render(<App/>,app);
阅读 4.4k
4 个回答

package,json文件看下

你这样引的Input能正常使用?

新手上路,请多包涵

开发时候正常的

新手上路,请多包涵

请问解决了吗? 我也是遇到

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题