From 5128a718e1f30c5617726f53bd18c4db492ad487 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=98=89=E6=B6=B5?= Date: Fri, 28 Jul 2017 15:43:28 +0800 Subject: [PATCH 1/5] support babel-plugin-import --- build/bin/build-lib.js | 87 +++++++++++++++++++ build/webpack.components.js | 7 +- package.json | 12 +-- .../{image_preview.css => image-preview.css} | 0 packages/vant-css/src/index.css | 2 +- yarn.lock | 12 +-- 6 files changed, 106 insertions(+), 14 deletions(-) create mode 100644 build/bin/build-lib.js rename packages/vant-css/src/{image_preview.css => image-preview.css} (100%) diff --git a/build/bin/build-lib.js b/build/bin/build-lib.js new file mode 100644 index 000000000..69204066c --- /dev/null +++ b/build/bin/build-lib.js @@ -0,0 +1,87 @@ +/** + * Build npm lib + * Steps: + * 1. 清理目录 + * 2. 构建 JS 入口文件 + * 3. 打包 JS 文件:vant.js && vant.min.js + * 4. 构建 CSS 文件:vant-css + * 5. 构建每个组件对应的 [component].js + * 6. 生成每个组件目录下的 style 入口 + * 7. 编译 utils + */ + +const fs = require('fs'); +const path = require('path'); +const components = require('../../components.json'); +const chalk = require('chalk'); +require('shelljs/global'); + +// clean dir +log('Starting', 'clean'); +exec('npm run clean --silent'); +log('Finished', 'clean'); + +// build entry +log('Starting', 'build:entry'); +exec('npm run build:file --silent'); +log('Finished', 'build:entry'); + +// lint +log('Starting', 'lint'); +exec('npm run lint --silent'); +log('Finished', 'lint'); + +// build vant.js +log('Starting', 'build:vant'); +exec('npm run build:vant --silent'); +log('Finished', 'build:vant'); + +// build [component].js +log('Starting', 'build:component'); +exec('npm run build:components --silent'); +log('Finished', 'build:component'); + +// build vant-css +log('Starting', 'build:vant-css'); +exec('npm run build:vant-css --silent'); +log('Finished', 'build:vant-css'); + +// build style entrys +log('Starting', 'build:style-entries'); +Object.keys(components).forEach((componentName) => { + const dir = path.join(__dirname, '../../lib/', componentName, '/style'); + const file = path.join(dir, 'index.js'); + const content = `require('../../vant-css/${componentName}.css');`; + mkdir(dir); + writeFile(file, content); +}); +log('Finished', 'build:style-entries'); + +// build utils +log('Starting', 'build:utils'); +exec('npm run build:utils --silent'); +log('Finished', 'build:utils'); + +// helpers +function log(status, action, breakLine) { + const now = new Date(); + const clock = `${breakLine ? '\n' : ''}[${padZero(now.getHours())}:${padZero(now.getMinutes())}:${padZero(now.getSeconds())}]`; + console.log(`${chalk.gray(clock)} ${status} '${action ? chalk.cyan.bold(action ) : ''}'`); +} + +function padZero(num) { + return (num < 10 ? '0' : '') + num; +} + +function writeFile(pathname, content) { + if (!fs.existsSync(pathname)) { + fs.closeSync(fs.openSync(pathname, 'w')); + } + fs.writeFileSync(pathname, content, { encoding: 'utf8' }); +} + +function mkdir(pathname) { + if (!fs.existsSync(pathname)) { + fs.mkdirSync(pathname); + } +} diff --git a/build/webpack.components.js b/build/webpack.components.js index f58de943f..39e8dd0ab 100644 --- a/build/webpack.components.js +++ b/build/webpack.components.js @@ -5,7 +5,12 @@ const webpack = require('webpack'); delete config.devtool; -config.entry = Components; +const entry = {}; +Object.keys(Components).forEach(key => { + entry[key + '/index'] = Components[key]; +}); + +config.entry = entry; config.externals = { vue: { diff --git a/package.json b/package.json index ad28a87c7..8194aae7d 100644 --- a/package.json +++ b/package.json @@ -15,13 +15,13 @@ "dev": "npm run build:file && webpack-dev-server --inline --config build/webpack.config.dev.js --content-base ./", "build:file": "node build/bin/build-entry.js", "build:utils": "cross-env BABEL_ENV=utils babel src --out-dir lib --ignore src/index.js", - "build:vant-css": "gulp build --gulpfile packages/vant-css/gulpfile.js && cp -R packages/vant-css/lib/ lib/vant-css", - "build:components": "cross-env NODE_ENV=production webpack --progress --hide-modules --config build/webpack.components.js", - "build:vant": "cross-env NODE_ENV=production webpack --progress --hide-modules --config build/webpack.build.js && cross-env NODE_ENV=production webpack -p --progress --hide-modules --config build/webpack.build.js", + "build:components": "cross-env NODE_ENV=production webpack --progress --hide-modules --config build/webpack.components.js --color", + "build:vant-css": "gulp build --gulpfile packages/vant-css/gulpfile.js --color && cp -R packages/vant-css/lib/ lib/vant-css", + "build:vant": "cross-env NODE_ENV=production webpack --progress --hide-modules --color --config build/webpack.build.js && cross-env NODE_ENV=production webpack -p --progress --hide-modules --color --config build/webpack.build.js", "deploy": "npm run deploy:docs && npm run deploy:cdn && gh-pages -d docs/dist --remote youzan && rimraf docs/dist", "deploy:cdn": "superman cdn /zanui/vue docs/dist/*.js docs/dist/*.css", "deploy:docs": "rimraf docs/dist && cross-env NODE_ENV=production webpack --progress --hide-modules --config build/webpack.config.prod.js", - "dist": "npm run clean && npm run build:file && npm run lint && npm run build:vant && npm run build:components && npm run build:utils && npm run build:vant-css", + "dist": "node build/bin/build-lib.js", "clean": "rimraf lib && rimraf packages/*/lib", "lint": "felint lint src/**/*.js packages/**/*.{js,vue} build/**/*.js", "test": "karma start test/unit/karma.conf.js --single-run", @@ -107,7 +107,7 @@ "vue-hot-reload-api": "^2.1.0", "vue-html-loader": "^1.2.4", "vue-loader": "^13.0.2", - "vue-markdown-loader": "^1.0.0", + "vue-markdown-loader": "^2.0.0", "vue-router": "^2.7.0", "vue-style-loader": "^3.0.0", "vue-template-compiler": "^2.4.2", @@ -115,6 +115,6 @@ "webpack": "^3.4.1", "webpack-dev-server": "^2.6.1", "webpack-merge": "^4.1.0", - "zan-doc": "^0.1.0" + "zan-doc": "^0.1.3" } } diff --git a/packages/vant-css/src/image_preview.css b/packages/vant-css/src/image-preview.css similarity index 100% rename from packages/vant-css/src/image_preview.css rename to packages/vant-css/src/image-preview.css diff --git a/packages/vant-css/src/index.css b/packages/vant-css/src/index.css index d83ee1789..d18b5a74d 100644 --- a/packages/vant-css/src/index.css +++ b/packages/vant-css/src/index.css @@ -23,7 +23,7 @@ @import './tab.css'; @import './col.css'; @import './row.css'; -@import './image_preview.css'; +@import './image-preview.css'; @import './actionsheet.css'; @import './quantity.css'; @import './progress.css'; diff --git a/yarn.lock b/yarn.lock index c1e84e362..0395214c9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7707,9 +7707,9 @@ vue-loader@^13.0.2: vue-style-loader "^3.0.0" vue-template-es2015-compiler "^1.5.3" -vue-markdown-loader@^1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/vue-markdown-loader/-/vue-markdown-loader-1.0.0.tgz#255a2608e388991faa354618e4f4b642ebb7e0db" +vue-markdown-loader@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/vue-markdown-loader/-/vue-markdown-loader-2.0.0.tgz#d3cadbf9c8976a81f2d5e39496d505fd4f31bc96" dependencies: cheerio "^0.20.0" highlight.js "^9.4.0" @@ -8043,9 +8043,9 @@ yeast@0.1.2: version "0.1.2" resolved "https://registry.yarnpkg.com/yeast/-/yeast-0.1.2.tgz#008e06d8094320c372dbc2f8ed76a0ca6c8ac419" -zan-doc@^0.1.0: - version "0.1.0" - resolved "https://registry.yarnpkg.com/zan-doc/-/zan-doc-0.1.0.tgz#6ea2aba808c39b35b9730899f000dbf05806cbad" +zan-doc@^0.1.3: + version "0.1.3" + resolved "https://registry.yarnpkg.com/zan-doc/-/zan-doc-0.1.3.tgz#86dd752bedccbedb48b125c1dbaf60be0c8c0896" dependencies: cheerio "0.22.0" decamelize "^1.2.0" From 4dd1a45d8ea2a538f0237c5def3462a7e5f34de2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=98=89=E6=B6=B5?= Date: Fri, 28 Jul 2017 16:04:13 +0800 Subject: [PATCH 2/5] fix: no style components --- build/bin/build-lib.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/build/bin/build-lib.js b/build/bin/build-lib.js index 69204066c..5c1706e17 100644 --- a/build/bin/build-lib.js +++ b/build/bin/build-lib.js @@ -51,7 +51,8 @@ log('Starting', 'build:style-entries'); Object.keys(components).forEach((componentName) => { const dir = path.join(__dirname, '../../lib/', componentName, '/style'); const file = path.join(dir, 'index.js'); - const content = `require('../../vant-css/${componentName}.css');`; + const cssPath = path.join(__dirname, '../../lib/vant-css/', `${componentName}.css`); + const content = fs.existsSync(cssPath) ? `require('../../vant-css/${componentName}.css');` : ''; mkdir(dir); writeFile(file, content); }); From 84634bb77d2ed049966b12f14fd79677e05211e0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=98=89=E6=B6=B5?= Date: Fri, 28 Jul 2017 17:05:45 +0800 Subject: [PATCH 3/5] import base.css in component styles --- build/bin/build-lib.js | 7 +++++-- packages/vant-css/src/base.css | 5 +++++ 2 files changed, 10 insertions(+), 2 deletions(-) create mode 100644 packages/vant-css/src/base.css diff --git a/build/bin/build-lib.js b/build/bin/build-lib.js index 5c1706e17..a9f47fad5 100644 --- a/build/bin/build-lib.js +++ b/build/bin/build-lib.js @@ -52,9 +52,12 @@ Object.keys(components).forEach((componentName) => { const dir = path.join(__dirname, '../../lib/', componentName, '/style'); const file = path.join(dir, 'index.js'); const cssPath = path.join(__dirname, '../../lib/vant-css/', `${componentName}.css`); - const content = fs.existsSync(cssPath) ? `require('../../vant-css/${componentName}.css');` : ''; + const content = [`require('../../vant-css/base.css');`]; + if (fs.existsSync(cssPath)) { + content.push(`require('../../vant-css/${componentName}.css');`); + } mkdir(dir); - writeFile(file, content); + writeFile(file, content.join('\n')); }); log('Finished', 'build:style-entries'); diff --git a/packages/vant-css/src/base.css b/packages/vant-css/src/base.css new file mode 100644 index 000000000..c2aa5264e --- /dev/null +++ b/packages/vant-css/src/base.css @@ -0,0 +1,5 @@ +/** + * 基本样式入口 + */ + +@import './reset.css'; From ad1755bffa6b9bdffe22f9f1f7550e2119b421c0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=98=89=E6=B6=B5?= Date: Mon, 31 Jul 2017 10:54:56 +0800 Subject: [PATCH 4/5] fix: component output librarayExport --- build/webpack.components.js | 4 ++-- package.json | 2 +- yarn.lock | 6 +++--- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/build/webpack.components.js b/build/webpack.components.js index 39e8dd0ab..d5a3c18fb 100644 --- a/build/webpack.components.js +++ b/build/webpack.components.js @@ -24,8 +24,8 @@ config.externals = { config.output = { path: path.join(__dirname, '../lib'), filename: '[name].js', - libraryTarget: 'umd', - umdNamedDefine: true + libraryExport: "default", + libraryTarget: 'umd' }; module.exports = config; diff --git a/package.json b/package.json index 8194aae7d..5fdd13032 100644 --- a/package.json +++ b/package.json @@ -115,6 +115,6 @@ "webpack": "^3.4.1", "webpack-dev-server": "^2.6.1", "webpack-merge": "^4.1.0", - "zan-doc": "^0.1.3" + "zan-doc": "^0.1.4" } } diff --git a/yarn.lock b/yarn.lock index 0395214c9..cbad07658 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8043,9 +8043,9 @@ yeast@0.1.2: version "0.1.2" resolved "https://registry.yarnpkg.com/yeast/-/yeast-0.1.2.tgz#008e06d8094320c372dbc2f8ed76a0ca6c8ac419" -zan-doc@^0.1.3: - version "0.1.3" - resolved "https://registry.yarnpkg.com/zan-doc/-/zan-doc-0.1.3.tgz#86dd752bedccbedb48b125c1dbaf60be0c8c0896" +zan-doc@^0.1.4: + version "0.1.4" + resolved "https://registry.yarnpkg.com/zan-doc/-/zan-doc-0.1.4.tgz#e226a438b07ffe1a08706f6349536438fec25f36" dependencies: cheerio "0.22.0" decamelize "^1.2.0" From dc2a44b05e3f5bd0f0c86cbe2f7c3f4cf66b4986 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=98=89=E6=B6=B5?= Date: Mon, 31 Jul 2017 10:58:27 +0800 Subject: [PATCH 5/5] fix: perDependencies vue version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 5fdd13032..5effc6a0d 100644 --- a/package.json +++ b/package.json @@ -45,7 +45,7 @@ "vue-lazyload": "^1.0.6" }, "peerDependencies": { - "vue": "2.3.4" + "vue": "2.4.2" }, "devDependencies": { "autoprefixer": "^7.1.2",