};
Vue.prototype.$loading = Loading.service;
// ...
};
/* istanbul ignore if */
if (typeof window !== 'undefined' && window.Vue) {
install(window.Vue);
}
export default {
version: '2.7.0',
locale: locale.use,
i18n: locale.i18n,
install,
CollapseTransition,
Loading,
Pagination,
// ... 这里省略大部分组件
TimelineItem
};
在组件的开发过程中如果组件较多,建议使用脚本自动生成构建入口文件。
npm run lint构建之前使用
lint 脚本对构建的源码文件进行
eslint 校验:
"lint": "eslint src/**/* test/**/* packages/**/* build/**/* --quiet",
Element 对
eslint 做了严格控制,一旦
eslint 报错那么
dist 总体构建脚本 执行停止,整体构建失败。这里的
eslint 校验可以使用eslint-loader 进行处理(如果你希望
eslint 校验失败也可以进行构建可以查看Errors and Warning )。
webpack --config build/webpack.conf.js
webpack --config build/webpack.conf.js 脚本用于构建umd总文件,执行该脚本最终会在
lib 下生成
index.js 文件:
lib
├── index.js # umd 总文件
webpack.conf.js 配置如下:
// build/webpack.conf.js// ...忽略
module.exports = {
mode: 'production',
// 指定入口文件src/index.js,该入口文件由`build:file`脚本自动生成
entry: {
app: ['./src/index.js'] },
output: {
// 在lib文件中生成
path: path.resolve(process.cwd(), './lib'),
// 生成lib/index.js
filename: 'index.js',
// 生成umd模块
libraryTarget: 'umd',
// src/index.js文件采用export default语法抛出,因此需要设置libraryExport
// 否则引入的UI组件库需要使用.default才能引用到抛出的对象
// if your entry has a default export of `MyDefaultModule`
// var MyDefaultModule = _entry_return_.default;
// 这里踩过坑,所以说明一下,不配置的话遇到的问题是引入的UI组件库没法解构
libraryExport: 'default',
},
resolve: {
extensions: ['.js', '.vue', '.json'],










