[youzan/vant]vant-cli打包后按需与全量引入一样的效果

重现链接

https://gitee.com/shuaigememeda/dustess-design

Vant Cli 版本

2.0.0

描述一下你遇到的问题。

npm库地址：https://www.npmjs.com/package/renjie-cli-app/v/1.0.1 仓库中有DemoInput，DemoButton两个组件，在项目中我采用按需引入方式，打包也会把所有组件打进去

// main.js
import { DemoInput } from 'renjie-cli-app'

Vue.component(DemoInput.name, DemoInput)

重现步骤

main.js中引入并注册


import { DemoInput } from 'renjie-cli-app'

Vue.component(DemoInput.name, DemoInput)


3. 执行打包build

RenJie0813

import { DemoInput } from 'renjie-cli-app' 这个要配合 babel-plugin-import 才能实现按需引入。

或者在 package.json 中配置 sideEffects 字段，通过 tree shaking 来实现按需引入。

chenjiahan

为什么我添加了运行依赖，在组件中import使用，打包的时候也会把axios的源码打进去 "peerDependencies": { "axios": "^0.24.0" }, "devDependencies": { "axios": "^0.24.0" },

RenJie0813

这个可以自行配置 webpack externals

chenjiahan

可是cdn引入在哪里引入呢，之前有个html的配置关了

RenJie0813

你指的是在文档网站中通过 CDN 引入 axios 吗，感觉不是很有必要，直接打包到文档网站里就可以

chenjiahan

我是开发业务组件库，所以组件当中需要使用axios，所以我放在peerDependencies，可是还是打包进去了

RenJie0813

在根目录下创建 webpack.config.js

module.exports = function () {
  if (process.env.BUILD_TARGET === 'package') {
    // 在此配置你的 webpack externals
    return {};
  }

  return {};
};

chenjiahan

externals

我悟了，打包的时候才配置外部依赖，祝大哥发财，万分感谢

RenJie0813

回答