npm run dist
"dist": "npm run clean && npm run build:file && npm run lint && webpack --config build/webpack.conf.js && webpack --config build/webpack.common.js && webpack --config build/webpack.component.js && npm run build:utils && npm run build:umd && npm run build:theme"
- npm run clean 清空
"clean": "rimraf lib && rimraf packages/*/lib && rimraf test/**/coverage"
- npm run build:file
"build:file": "node build/bin/iconInit.js & node build/bin/build-entry.js & node build/bin/i18n.js & node build/bin/version.js"
-
node build/bin/iconInit.js 得到 el-icon 样式文件里的 icon 名称,倒序后输出到
examples/icon.json
-
node build/bin/build-entry.js 通过
components.json
的映射关系和json-templater
的模版替换,生成src/index.js
-
node build/bin/i18n.js 将
examples/pages/template
里的.tpl
后缀作为模版,根据examples/i18n/page.json
里的替换字符,进行替换,并输出到examples/pages
-
node build/bin/version.js 生成版本文件,提供给
examples/components/header.vue
用于版本切换的选择,跳转到指定版本的location.href
- npm run lint
–quiet选项用于减少ESLint输出的噪音。当使用此选项时,ESLint将只输出错误和警告,而不会输出其他信息,例如检查的文件数和处理时间
"lint": "eslint src/**/* test/**/* packages/**/* build/**/* --quiet",
-
webpack --config build/webpack.conf.js
1.生成的lib/index.js
文件给 cdn 用<script src="https://unpkg.com/element-ui/lib/index.js"></script>
2.其中
publicPath: '/dist/'
当被引用的时候,路径要带上/dist/
-
webpack --config build/webpack.common.js
生成的是全局引入 -
webpack --config build/webpack.component.js
生成的是按需引入 -
npm run build:utils
"build:utils": "cross-env BABEL_ENV=utils babel src --out-dir lib --ignore src/index.js",
它使用了 Babel 工具链中的 babel 命令,将 src 目录中的 JavaScript 代码编译为 lib 目录中的 ES5 代码,并忽略了 src/index.js 文件。其中,cross-env 是一个跨平台的环境变量设置工具,用于设置 BABEL_ENV 环境变量为 utils
-
npm run build:umd
"build:umd": "node build/bin/build-locale.js",
var transform = function(filename, name, cb) { require('babel-core').transformFile(resolve(localePath, filename), { plugins: [ 'add-module-exports', ['transform-es2015-modules-umd', {loose: true}] ], moduleId: name }, cb); };
1.
src/locale/lang
里的文件被require('babel-core').transformFile
转换后的文件放在lib/umd/locale
2.transform 函数是一个用于将指定文件转换为 UMD 模块格式的函数。具体来说,它使用了 Babel 工具链中的 transformFile 方法,将指定的文件编译为 UMD 模块格式,并在编译过程中使用了 add-module-exports 和 transform-es2015-modules-umd 两个插件。其中,add-module-exports 插件用于将 ES6 模块转换为 CommonJS 模块,并添加 module.exports 属性,以便在 Node.js 等环境中使用。
transform-es2015-modules-umd 插件用于将 ES6 模块转换为 UMD 模块,并添加适当的 UMD 包装器,以便在浏览器等环境中使用。moduleId 选项指定了 UMD 模块的 ID,即模块名称
-
npm run build:theme
"build:theme": "node build/bin/gen-cssfile && gulp build --gulpfile packages/theme-chalk/gulpfile.js && cp-cli packages/theme-chalk/lib lib/theme-chalk",
-
node build/bin/gen-cssfile
检查packages/theme-chalk/src
里是否有components.json
对应的scss
文件,没有的话,生成。并生成packages/theme-chalk/src/index.scss
里面是所有组件的导入
-
gulp build --gulpfile packages/theme-chalk/gulpfile.js
将packages/theme-chalk/src
下的scss
转换为css
并压缩,将font
压缩,后放到packages/theme-chalk/lib
下面 -
cp-cli packages/theme-chalk/lib lib/theme-chalk"
将packages/theme-chalk/lib
复制一份到lib/theme-chalk
下面
-
npm run dev:extension
"dev:extension": "rimraf examples/extension/dist && cross-env NODE_ENV=development webpack --watch --config build/webpack.extension.js",
打包构建主题编辑器的 chorme 插件项目–Element Theme Roller 官方商城地址
npm run pub
"pub": "npm run bootstrap && sh build/git-release.sh && sh build/release.sh && node build/bin/gen-indices.js",
- sh build/git-release.sh
检查代码 dev 分支是否存在冲突(No conflicts); - sh build/release.sh
合并dev分支到master分支、更新版本号、发布主题、push代码到远程仓库、发布组件库至NPM - node build/bin/gen-indices.js
将examples/docs
里的.md
内容格式化后,上传到algolia
, 用于云搜索
npm run test
"test": "npm run lint && npm run build:theme && cross-env CI_ENV=/dev/ BABEL_ENV=test karma start test/unit/karma.conf.js --single-run",
设置了参数 --single-run 执行一次测试之后,karma 会自动停掉
npm run test:watch
"test:watch": "npm run build:theme && cross-env BABEL_ENV=test karma start test/unit/karma.conf.js"
若文件变更,重新执行一次测试