From 746bea14be45a9b6babacde7600561e71500b1da Mon Sep 17 00:00:00 2001 From: ClarkXia Date: Tue, 22 Oct 2019 10:24:45 +0800 Subject: [PATCH 1/5] chore: verison --- packages/ice-scripts/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/ice-scripts/package.json b/packages/ice-scripts/package.json index 778d683..b244485 100644 --- a/packages/ice-scripts/package.json +++ b/packages/ice-scripts/package.json @@ -1,6 +1,6 @@ { "name": "ice-scripts", - "version": "2.1.11", + "version": "2.1.12", "description": "ICE SDK", "main": "index.js", "bin": { From c15fca1546578fa6d21be66429bfa2f5c551e712 Mon Sep 17 00:00:00 2001 From: ClarkXia Date: Wed, 23 Oct 2019 20:47:30 +0800 Subject: [PATCH 2/5] feat: support cli option to disable auto open browser (#67) --- packages/ice-scripts/bin/child-process-dev.js | 1 + packages/ice-scripts/lib/commands/dev.js | 4 +++- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/ice-scripts/bin/child-process-dev.js b/packages/ice-scripts/bin/child-process-dev.js index 1e7b8b8..525bfca 100644 --- a/packages/ice-scripts/bin/child-process-dev.js +++ b/packages/ice-scripts/bin/child-process-dev.js @@ -15,6 +15,7 @@ program .option('--analyzer-port', '设置分析端口号') .option('--disabled-reload', '关闭 hot reload') .option('--disabled-mock', '关闭 mock') + .option('--disabled-open', 'do not open browser after compile') .option('--config ', 'use custom config') .parse(process.argv); diff --git a/packages/ice-scripts/lib/commands/dev.js b/packages/ice-scripts/lib/commands/dev.js index 0a7e6d0..4d509a2 100644 --- a/packages/ice-scripts/lib/commands/dev.js +++ b/packages/ice-scripts/lib/commands/dev.js @@ -110,7 +110,9 @@ module.exports = async function(context, subprocess) { ` - Network: ${chalk.yellow(urls.lanUrlForTerminal)}`, ].join('\n') ); - openBrowser(urls.localUrlForBrowser); + if (!commandArgs.disabledOpen) { + openBrowser(urls.localUrlForBrowser); + } } applyHook('afterDev', stats); From 2546d93a7187c275cdfa6fe02b4938015de7298d Mon Sep 17 00:00:00 2001 From: ClarkXia Date: Thu, 24 Oct 2019 09:55:58 +0800 Subject: [PATCH 3/5] fix: check wrap lines when resolve sass import (#68) --- .../lib/compile/fusion/resolveSassImport.js | 82 ------------------- packages/ice-plugin-component/lib/index.js | 2 +- packages/ice-plugin-component/package.json | 3 +- packages/resolve-sass-import/CHANGELOG.md | 6 +- packages/resolve-sass-import/index.js | 3 +- packages/resolve-sass-import/package.json | 2 +- 6 files changed, 11 insertions(+), 87 deletions(-) delete mode 100644 packages/ice-plugin-component/lib/compile/fusion/resolveSassImport.js diff --git a/packages/ice-plugin-component/lib/compile/fusion/resolveSassImport.js b/packages/ice-plugin-component/lib/compile/fusion/resolveSassImport.js deleted file mode 100644 index 9b4ed785..0000000 --- a/packages/ice-plugin-component/lib/compile/fusion/resolveSassImport.js +++ /dev/null @@ -1,82 +0,0 @@ -const fse = require('fs-extra'); -const path = require('path'); -const { urlToRequest } = require('loader-utils'); -const resolve = require('resolve'); - -let charset = ''; -function resolveSassFile(sassFile, rootDir) { - const matchModuleImport = /^~([^/]+|@[^/]+[/][^/]+)$/; - let sassContent = ''; - try { - // get sass content - const filePath = path.isAbsolute(sassFile) ? sassFile : path.resolve(rootDir, sassFile); - sassContent = String(fse.readFileSync(filePath, 'utf-8')); - } catch (e) { - console.log('Can not open sass file', sassFile); - } - // remove charset - // note: every import statement must be written in separate line - return sassContent.replace(/@charset[ ]*["' ]?[^\s]*["' ]?;/g, (str) => { - charset = str; - return ''; - }).replace(/(^\s?|\n)\s?@import[ ]*[url(]*["' ]?[^\s]*/g, (importStr) => { - if (importStr) { - const [, importUrl] = /@import[ ]*[url(]?[("' ]?([^)'"\s]*)/.exec(importStr); - if (importUrl) { - let resolvePaths; - const request = urlToRequest(importUrl); - const ext = path.extname(request); - // inspired by https://github.com/webpack-contrib/sass-loader/blob/master/lib/importsToResolve.js - if (matchModuleImport.test(importUrl) || ['.css', '.scss', '.sass'].indexOf(ext) > -1) { - resolvePaths = [request, importUrl]; - } else { - // In case there is no file extension... - // - Prefer modules starting with '_'. - // - File extension precedence: .scss, .sass, .css. - const basename = path.basename(request); - - if (basename.charAt(0) === '_') { - resolvePaths = [`${request}.scss`, `${request}.sass`, `${request}.css`, importUrl]; - } - - const dirname = path.dirname(request); - - resolvePaths = [ - `${dirname}/_${basename}.scss`, - `${dirname}/_${basename}.sass`, - `${dirname}/_${basename}.css`, - `${request}.scss`, - `${request}.sass`, - `${request}.css`, - importUrl, - ]; - } - - // resolve file - let resolvePath; - for (let i = 0; i < resolvePaths.length; i++) { - let res = null; - try { - res = resolve.sync(resolvePaths[i], { basedir: rootDir }); - } catch (err) { - res = ''; - } - if (res) { - resolvePath = res; - break; - } - } - - if (resolvePath) { - return resolveSassFile(resolvePath, path.dirname(resolvePath)); - } - } - } - return ''; - }); -} - -module.exports = (filePath, dir) => { - const sassContent = resolveSassFile(filePath, dir); - return `${charset ? `${charset}\n` : ''}${sassContent}`; -}; diff --git a/packages/ice-plugin-component/lib/index.js b/packages/ice-plugin-component/lib/index.js index 7cd2206..698a099 100644 --- a/packages/ice-plugin-component/lib/index.js +++ b/packages/ice-plugin-component/lib/index.js @@ -1,6 +1,7 @@ const path = require('path'); const fse = require('fs-extra'); const clonedeep = require('lodash.clonedeep'); +const resolveSassImport = require('resolve-sass-import'); const { getPkgJSONSync } = require('./utils/pkgJson'); const getDemoDir = require('./utils/getDemoDir'); const getDemos = require('./utils/getDemos'); @@ -9,7 +10,6 @@ const { parseMarkdownParts } = require('./compile/component/markdownHelper'); const buildSrc = require('./compile/component/buildSrc'); const modifyPkgHomePage = require('./compile/component/modifyPkgHomePage'); const ComponentStyleGenerator = require('./compile/fusion/componentStyleGenerator'); -const resolveSassImport = require('./compile/fusion/resolveSassImport'); const baseConfig = require('./configs/base'); const devConfig = require('./configs/dev'); const buildConfig = require('./configs/build'); diff --git a/packages/ice-plugin-component/package.json b/packages/ice-plugin-component/package.json index d446a68..2b23f97 100644 --- a/packages/ice-plugin-component/package.json +++ b/packages/ice-plugin-component/package.json @@ -25,6 +25,7 @@ "marked": "^0.6.2", "npmlog": "^4.1.2", "prismjs": "^1.16.0", - "resolve": "^1.11.0" + "resolve": "^1.11.0", + "resolve-sass-import": "^0.1.0" } } diff --git a/packages/resolve-sass-import/CHANGELOG.md b/packages/resolve-sass-import/CHANGELOG.md index 69dca99..f452786 100644 --- a/packages/resolve-sass-import/CHANGELOG.md +++ b/packages/resolve-sass-import/CHANGELOG.md @@ -1,5 +1,9 @@ # Changelog +## 0.1.1 + +- [fix] check wrap lines when resolve sass import + ## 0.1.0 - - [feat] basic feature for resolve sass import \ No newline at end of file +- [feat] basic feature for resolve sass import \ No newline at end of file diff --git a/packages/resolve-sass-import/index.js b/packages/resolve-sass-import/index.js index 9b4ed785..5045aaf 100644 --- a/packages/resolve-sass-import/index.js +++ b/packages/resolve-sass-import/index.js @@ -68,7 +68,8 @@ function resolveSassFile(sassFile, rootDir) { } if (resolvePath) { - return resolveSassFile(resolvePath, path.dirname(resolvePath)); + const isLineWrap = /^\n/.exec(importStr); + return `${isLineWrap ? '\n' : ''}${resolveSassFile(resolvePath, path.dirname(resolvePath))}`; } } } diff --git a/packages/resolve-sass-import/package.json b/packages/resolve-sass-import/package.json index 9c3b41d..6e67a06 100644 --- a/packages/resolve-sass-import/package.json +++ b/packages/resolve-sass-import/package.json @@ -1,6 +1,6 @@ { "name": "resolve-sass-import", - "version": "0.1.0", + "version": "0.1.1", "description": "resolve sass import", "main": "index.js", "scripts": { From e2f96b2929cadc21bd152b52185bc61383f3f5db Mon Sep 17 00:00:00 2001 From: ClarkXia Date: Thu, 24 Oct 2019 16:55:15 +0800 Subject: [PATCH 4/5] feat: support file watcher for compile library (#65) * feat: file watcher for compile library * chore: version and changelog * chore: fix lint --- packages/ice-plugin-component/CHANGELOG.md | 6 +- .../lib/compile/fusion/depAnalyze.js | 3 +- packages/ice-plugin-component/lib/index.js | 61 +++++++++++++------ packages/ice-plugin-component/package.json | 3 +- 4 files changed, 50 insertions(+), 23 deletions(-) diff --git a/packages/ice-plugin-component/CHANGELOG.md b/packages/ice-plugin-component/CHANGELOG.md index d410dae..de91111 100644 --- a/packages/ice-plugin-component/CHANGELOG.md +++ b/packages/ice-plugin-component/CHANGELOG.md @@ -1,12 +1,16 @@ # Changelog +## 0.1.7 + + - [feat] support option watch for compile library when source files changed + ## 0.1.6 - [fix] externals react-dom ## 0.1.5 - - [fix] fix: modular-import did not work with ice-plugin-component alibaba/ice#2724 + - [fix] modular-import did not work with ice-plugin-component alibaba/ice#2724 ## 0.1.4 diff --git a/packages/ice-plugin-component/lib/compile/fusion/depAnalyze.js b/packages/ice-plugin-component/lib/compile/fusion/depAnalyze.js index 33d6550..d8af82b 100755 --- a/packages/ice-plugin-component/lib/compile/fusion/depAnalyze.js +++ b/packages/ice-plugin-component/lib/compile/fusion/depAnalyze.js @@ -44,8 +44,9 @@ function dedupe(arr) { // 为了让 require.resolve 可以解析 .jsx 和 .vue 文件 require.extensions['.jsx'] = require.extensions['.js']; require.extensions['.vue'] = require.extensions['.js']; -const tracedFiles = {}; + module.exports = function (entryFilePath) { + const tracedFiles = {}; let result = []; trace(require.resolve(entryFilePath)); diff --git a/packages/ice-plugin-component/lib/index.js b/packages/ice-plugin-component/lib/index.js index 698a099..191f368 100644 --- a/packages/ice-plugin-component/lib/index.js +++ b/packages/ice-plugin-component/lib/index.js @@ -1,6 +1,7 @@ const path = require('path'); const fse = require('fs-extra'); const clonedeep = require('lodash.clonedeep'); +const chokidar = require('chokidar'); const resolveSassImport = require('resolve-sass-import'); const { getPkgJSONSync } = require('./utils/pkgJson'); const getDemoDir = require('./utils/getDemoDir'); @@ -15,9 +16,10 @@ const devConfig = require('./configs/dev'); const buildConfig = require('./configs/build'); const adaptorBuildConfig = require('./configs/adaptorBuild'); +let watcher = null; module.exports = ({ context, chainWebpack, onHook, log }, opts = {}) => { const { command, rootDir, reRun } = context; - const { type = 'fusion' } = opts; + const { type = 'fusion', watch } = opts; const pkg = getPkgJSONSync(rootDir); // store webpack chain config let webpackChain; @@ -74,32 +76,51 @@ module.exports = ({ context, chainWebpack, onHook, log }, opts = {}) => { } }); + const compileLib = () => { + // get babel config after all plugin had been excuted + const babelConfig = clonedeep(webpackChain.module.rule('jsx').use('babel-loader').get('options')); + delete babelConfig.cacheDirectory; + // component buildSrc + buildSrc({ babelConfig, rootDir, log }); + if (type === 'fusion') { + const styleGenerator = new ComponentStyleGenerator({ + cwd: rootDir, + destPath: path.join(rootDir, 'lib'), + absoulte: false, + }); + + styleGenerator.writeStyleJSSync(); + log.info('Generated style.js'); + + styleGenerator.writeIndexScssSync(); + log.info('Generated index.scss'); + } + }; + + if (!watcher && watch) { + const srcPath = path.join(rootDir, 'src'); + log.info(`Start watch path: ${srcPath}`); + watcher = chokidar.watch(srcPath, { + ignoreInitial: true, + }); + + watcher.on('change', (file) => { + log.info(`${file} changed, start compile library.`); + compileLib(); + }); + + watcher.on('error', (error) => { + log.error('fail to watch file', error); + }); + } // flag for run build again, only excute at the first time of load this plugin if (!process.env.BUILD_AGAIN) { // build src and umd adpator after demo build onHook('afterBuild', () => { process.env.BUILD_AGAIN = true; - // get babel config after all plugin had been excuted - const babelConfig = clonedeep(webpackChain.module.rule('jsx').use('babel-loader').get('options')); - delete babelConfig.cacheDirectory; - // component buildSrc - buildSrc({ babelConfig, rootDir, log }); + compileLib(); modifyPkgHomePage(pkg, rootDir); - if (type === 'fusion') { - const styleGenerator = new ComponentStyleGenerator({ - cwd: rootDir, - destPath: path.join(rootDir, 'lib'), - absoulte: false, - }); - - styleGenerator.writeStyleJSSync(); - log.info('Generated style.js'); - - styleGenerator.writeIndexScssSync(); - log.info('Generated index.scss'); - } - if (hasAdaptor) { // generate adaptor index.scss const sassContent = resolveSassImport('main.scss', path.resolve(rootDir, 'src')); diff --git a/packages/ice-plugin-component/package.json b/packages/ice-plugin-component/package.json index 2b23f97..626e9b7 100644 --- a/packages/ice-plugin-component/package.json +++ b/packages/ice-plugin-component/package.json @@ -1,6 +1,6 @@ { "name": "ice-plugin-component", - "version": "0.1.6", + "version": "0.1.7", "description": "ice plugin for develop component", "main": "lib/index.js", "scripts": { @@ -15,6 +15,7 @@ "dependencies": { "@babel/core": "^7.4.4", "@babel/plugin-transform-runtime": "^7.4.4", + "chokidar": "^3.2.2", "fs-extra": "^8.0.1", "handlebars": "^4.1.2", "handlebars-loader": "^1.7.1", From e5101232b43447d1e808672bedffae240a7937f0 Mon Sep 17 00:00:00 2001 From: ClarkXia Date: Thu, 24 Oct 2019 17:05:34 +0800 Subject: [PATCH 5/5] chore: changelog --- CHANGELOG.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index e6bf6bf..3607b79 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,11 @@ # Changelog +## 2.1.12 + +- [feat] support file watcher for compile library alibaba/ice#2844 +- [feat] support cli option to disable open browser alibaba/ice#2875 +- [fix] wrap lines when resolve sass import alibaba/ice#2876 + ## 2.1.11 - [fix] error mimetype of image