Merge pull request #38 from cmux/0.7

0.7.4 ready to release

package.json

@@ -3,14 +3,17 @@
     "description": "All modules and packages for Koot.js",
     "scripts": {
         "doc-server": "docsify serve docs",
+        "bootstrap": "lerna bootstrap --hoist",
         "lerna": "lerna-wizard",
         "lerna:bootstrap": "lerna bootstrap --hoist",
         "lerna:publish": "lerna publish",
         "lerna:version": "lerna version",
         "pretest": "node ./test/pre-test.js",
-        "test": "jest",
+        "test": "jest \"^((?!need-in-order).)*\\.js$\" && npm run test:react",
         "test:factoryconfig": "jest ./test/cases/actory-config/test.js",
-        "test:react:isomorphic": "jest ./test/cases/react-isomorphic/test.js",
+        "test:react": "npm run test:react:spa && npm run test:react:isomorphic",
+        "test:react:isomorphic": "jest ./test/cases/react-isomorphic",
+        "test:react:spa": "jest ./test/cases/react-spa",
         "test:libs:validate-pathname": "jest ./test/cases/libs/validate-pathname",
         "test:libs:validate-config": "jest ./test/cases/libs/validate-config",
         "eslint:koot": "eslint \"packages/koot/!(node_modules|logs|dist|dist*|test)/**/*.+(js|jsx)\""
@@ -43,15 +46,17 @@
     },
     "license": "Apache-2.0",
     "devDependencies": {
-        "lerna": "3.4.3",
-        "lerna-wizard": "1.0.9"
-    },
-    "dependencies": {
-        "docsify-cli": "4.3.0",
+        "lerna": "3.5.0",
+        "lerna-wizard": "1.0.9",
         "eslint": "5.9.0",
         "eslint-plugin-react": "7.11.1",
         "babel-eslint": "10.0.1",
         "jest": "23.6.0",
-        "puppeteer": "1.10.0"
+        "puppeteer": "1.10.0",
+        "jsdom": "13.0.0",
+        "fs-extra": "7.0.1"
+    },
+    "dependencies": {
+        "docsify-cli": "4.3.0"
     }
 }

packages/koot-webpack/plugins/spa-template.js

@@ -11,6 +11,7 @@ const __ = require('../libs/require-koot')('utils/translate')
 const getDistPath = require('../libs/require-koot')('utils/get-dist-path')
 const getCwd = require('../libs/require-koot')('utils/get-cwd')
 const getChunkmap = require('../libs/require-koot')('utils/get-chunkmap')
+const getDirDistPublic = require('../libs/require-koot')('libs/get-dir-dist-public')
 
 /**
  * Webpack 插件 - 生成 SPA 主页面文件
@@ -143,7 +144,7 @@ class SpaTemplatePlugin {
 
             // 生产环境：写入文件
             if (process.env.WEBPACK_BUILD_ENV === 'prod') {
-                const pathname = path.resolve(getDistPath(), 'public/', filename)
+                const pathname = path.resolve(getDirDistPublic(getDistPath()), filename)
                 await fs.ensureFile(pathname)
                 await fs.writeFile(
                     pathname,
@@ -160,6 +161,7 @@ class SpaTemplatePlugin {
             // 生产环境：报告文件写入完成
             if (process.env.WEBPACK_BUILD_ENV === 'prod') {
                 setTimeout(() => {
+                    console.log('')
                     if (fail) {
                         setTimeout(() => {
                             console.log(

packages/koot/CHANGELOG.md

@@ -1,5 +1,5 @@
 ## 0.7.4
-**2018-11-??**
+**2018-11-29**
 - 核心
   - Webpack 打包
     - 现在每种打包模式仅保留最近 5 次打包的日志文件 (`/logs/webpack-config/` 目录下)
@@ -11,7 +11,6 @@
   - 修复并发访问时存在多个 `koot-locale-id` meta 标签的问题
   - 修复某些情况下，HTML 同构结果中 `<script>` 标签之间会出现额外逗号 (`,`) 的问题
 - 更新依赖包
-  - major
   - minor
     - `webpack` -> _4.26.1_
   - patch

packages/koot/ReactApp/server/modify-koa-app.js

@@ -19,6 +19,7 @@ import { CHANGE_LANGUAGE, TELL_CLIENT_URL, SYNC_COOKIE } from '../action-types'
 import kootClient from '../client/run'
 import ReactIsomorphic from '../ReactIsomorphic'
 const getDistPath = require('../../utils/get-dist-path')
+const getDirDistPublic = require('../../libs/get-dir-dist-public')
 
 import middlewareRouterDev from './middlewares/router-dev'
 
@@ -177,7 +178,7 @@ export default async (app, {
 
     /* 静态目录,用于外界访问打包好的静态文件js、css等 */
     app.use(convert(koaStatic(
-        path.resolve(getDistPath(), './public'),
+        getDirDistPublic(getDistPath()),
         {
             maxage: 0,
             hidden: true,

packages/koot/ReactSPA/inject.js

@@ -14,7 +14,7 @@ module.exports = (options = {}) => {
         filemap,
         entrypoints,
 
-        title: 'TEST',
+        title: process.env.KOOT_PROJECT_NAME,
         metas: '',
         reactHtml: '<!-- REACT ROOT -->',
         stylesHtml: '',

packages/koot/bin/dev.js

@@ -477,7 +477,7 @@ const run = async () => {
             `  `
             + chalk.yellowBright('[koot/build] ')
             + __('build.build_start', {
-                type: chalk.cyanBright(appType),
+                type: chalk.cyanBright(__(`appType.${appType}`)),
                 stage: chalk.green('client'),
                 env: chalk.green('dev'),
             })
@@ -505,7 +505,7 @@ const run = async () => {
             chalk.green('√ ')
             + chalk.yellowBright('[koot/build] ')
             + __('build.build_complete', {
-                type: chalk.cyanBright(appType),
+                type: chalk.cyanBright(__(`appType.${appType}`)),
                 stage: chalk.green('client'),
                 env: chalk.green('dev'),
             })
@@ -528,7 +528,7 @@ const run = async () => {
             `  `
             + chalk.yellowBright('[koot/build] ')
             + __('build.build_start', {
-                type: chalk.cyanBright(appType),
+                type: chalk.cyanBright(__(`appType.${appType}`)),
                 stage: chalk.green('server'),
                 env: chalk.green('dev'),
             })
@@ -550,7 +550,7 @@ const run = async () => {
             chalk.green('√ ')
             + chalk.yellowBright('[koot/build] ')
             + __('build.build_complete', {
-                type: chalk.cyanBright(appType),
+                type: chalk.cyanBright(__(`appType.${appType}`)),
                 stage: chalk.green('server'),
                 env: chalk.green('dev'),
             })

packages/koot/core/middleware.js

@@ -1,17 +1,16 @@
 // 此文件可或者 koa 中间件，所有 app 都会用到
 // 扩展时候需考虑普适性
 
-const path = require('path')
 const getDistPath = require('../utils/get-dist-path')
+const getDirDistPublic = require('../libs/get-dir-dist-public')
 
 module.exports = (server) => {
 
     /* 静态目录,用于外界访问打包好的静态文件js、css等 */
 
     const koaStatic = require('koa-static')
     const convert = require('koa-convert')
-    // const rootPath = getCwd() + '/dist/public'
-    const rootPath = path.resolve(getDistPath(), './public')
+    const rootPath = getDirDistPublic(getDistPath())
     const option = {
         maxage: 0,
         hidden: true,

packages/koot/core/pwa/create.js

@@ -6,6 +6,7 @@ const glob = require('glob-promise')
 const defaults = require('../../defaults/pwa')
 const getChunkmapPath = require('../../utils/get-chunkmap-path')
 const getDistPath = require('../../utils/get-dist-path')
+const getDirDistPublic = require('../../libs/get-dir-dist-public')
 
 const parseChunkmapPathname = pathname => pathname.replace(/^public\//g, '')
 
@@ -60,7 +61,7 @@ const create = async (settings = {}, i18n) => {
 
     const pathnamePolyfill = []
     const pathnameChunkmap = getChunkmapPath()
-    const outputPath = path.resolve(getDistPath(), './public/')
+    const outputPath = getDirDistPublic(getDistPath())
     const i18nType = typeof i18n === 'object' ? i18n.type : undefined
     const isI18nDefault = (i18nType === 'default')
 

packages/koot/core/webpack/build.js

@@ -20,6 +20,7 @@ const __ = require('../../utils/translate')
 const spinner = require('../../utils/spinner')
 const getDistPath = require('../../utils/get-dist-path')
 const getAppType = require('../../utils/get-app-type')
+const readBaseConfig = require('../../utils/read-base-config')
 // const getCwd = require('../../utils/get-cwd')
 // const sleep = require('../../utils/sleep')
 
@@ -109,6 +110,8 @@ module.exports = async (kootBuildConfig = {}) => {
     // ========================================================================
     //
     // 先期准备
+    // - 确定、抽取配置
+    // - 更新环境变量
     //
     // ========================================================================
 
@@ -127,9 +130,13 @@ module.exports = async (kootBuildConfig = {}) => {
         [keyConfigBuildDll]: createDll = false,
     } = kootBuildConfig
 
-    // 确定项目类型
+    /** @type {String} 项目类型 */
     const appType = await getAppType()
 
+    /** @type {String} 项目名 */
+    const appName = await readBaseConfig('name')
+    process.env.KOOT_PROJECT_NAME = appName
+
     // 抽取环境变量
     const {
         WEBPACK_BUILD_TYPE: TYPE,
@@ -149,11 +156,14 @@ module.exports = async (kootBuildConfig = {}) => {
     }
 
     // log: 打包流程正式开始
-    log('build', __('build.build_start', {
-        type: chalk.cyanBright(appType),
-        stage: chalk.green(STAGE),
-        env: chalk.green(ENV),
-    }))
+    log('build', __(
+        TYPE === 'spa' ? 'build.build_start_no_stage' : 'build.build_start',
+        {
+            type: chalk.cyanBright(__(`appType.${appType}`)),
+            stage: chalk.green(STAGE),
+            env: chalk.green(ENV),
+        }
+    ))
 
     /** @type {Function} @async 流程回调: webpack 执行前 */
     const before = async () => {
@@ -208,11 +218,14 @@ module.exports = async (kootBuildConfig = {}) => {
             await afterBuild(data)
 
         // 标记完成
-        log('success', 'build', __('build.build_complete', {
-            type: chalk.cyanBright(appType),
-            stage: chalk.green(STAGE),
-            env: chalk.green(ENV),
-        }))
+        log('success', 'build', __(
+            TYPE === 'spa' ? 'build.build_complete_no_stage' : 'build.build_complete',
+            {
+                type: chalk.cyanBright(__(`appType.${appType}`)),
+                stage: chalk.green(STAGE),
+                env: chalk.green(ENV),
+            }
+        ))
 
         // await sleep(20 * 1000)
         // console.log(`  > start: ${timestampStart}`)

packages/koot/core/webpack/common.js

@@ -89,6 +89,7 @@ const plugins = (env, stage, defines = {}) => {
     }
 
     const envs = [
+        'KOOT_PROJECT_NAME',
         'KOOT_DIST_DIR',
         'KOOT_I18N',
         'KOOT_I18N_TYPE',

packages/koot/core/webpack/config/transform-config-client.js

@@ -22,6 +22,7 @@ const transformOutputPublicpath = require('./transform-output-publicpath')
 
 const getCwd = require('../../../utils/get-cwd')
 const getWDSport = require('../../../utils/get-webpack-dev-server-port')
+const getDirDistPublic = require('../../../libs/get-dir-dist-public')
 
 /**
  * Webpack 配置处理 - 客户端配置
@@ -44,15 +45,14 @@ module.exports = async (kootBuildConfig = {}) => {
         webpackCompilerHook = {},
     } = kootBuildConfig
 
+    /** @type {String} 默认入口文件 */
     const defaultClientEntry = path.resolve(
         __dirname,
         '../../../',
         appType,
         './client'
     )
 
-    const pathPublic = path.resolve(dist, `public`)
-
     let index = 0
     const handleSingleConfig = async (localeId, localesObj) => {
         const {
@@ -62,8 +62,13 @@ module.exports = async (kootBuildConfig = {}) => {
             WEBPACK_DEV_SERVER_PORT: clientDevServerPort,
         } = process.env
 
+        /** @type {Boolean} 是否为多语言分包模式 */
         const isSeperateLocale = localeId && typeof localesObj === 'object'
 
+        /** @type {String} 打包结果基础目录 (最终的打包目录是该目录下的 defaultPublicDirName 目录) */
+        const pathPublic = getDirDistPublic(dist)
+
+        /** @type {Object} 默认配置 */
         const configTargetDefault = await createTargetDefaultConfig({
             pathRun: getCwd(),
             clientDevServerPort,
@@ -175,7 +180,8 @@ module.exports = async (kootBuildConfig = {}) => {
                     result.plugins.push(new CopyWebpackPlugin([
                         {
                             from: staticAssets,
-                            to: TYPE === 'spa' ? undefined : path.relative(result.output.path, pathPublic)
+                            to: TYPE === 'spa' && ENV === 'dev' ? undefined : path.relative(result.output.path, pathPublic)
+                            // to: path.relative(result.output.path, pathPublic)
                         }
                     ]))
             }

packages/koot/core/webpack/config/transform-config-server.js

@@ -11,6 +11,7 @@ const transformConfigLast = require('./transform-config-last')
 const transformOutputPublicpath = require('./transform-output-publicpath')
 
 const getCwd = require('../../../utils/get-cwd')
+const getDirDistPublic = require('../../../libs/get-dir-dist-public')
 
 /**
  * Webpack 配置处理 - 服务器端配置
@@ -90,7 +91,7 @@ module.exports = async (kootBuildConfig = {}) => {
             result.plugins.push(new CopyWebpackPlugin([
                 {
                     from: staticAssets,
-                    to: path.relative(result.output.path, path.resolve(dist, `public`))
+                    to: path.relative(result.output.path, getDirDistPublic(dist))
                 }
             ]))
 

packages/koot/libs/get-dir-dist-public.js

@@ -0,0 +1,11 @@
+const path = require('path')
+
+/**
+ * 获取打包结果基础目录
+ * 最终的打包目录是该目录下的 includes (默认情况)
+ * @param {String} dist 打包结果目录
+ * @returns {String}
+ */
+module.exports = (dist) => {
+    return path.resolve(dist, process.env.WEBPACK_BUILD_TYPE === 'spa' ? '' : `public`)
+}

packages/koot/libs/validate-config.js

@@ -15,8 +15,17 @@ const {
 } = require('../defaults/before-build')
 
 /**
- * 根据 koot.config.js 生成 koot.js 和构建配置对象
- * @returns {Object} 构建配置对象
+ * 根据 koot.config.js 生成 koot.js 和打包配置对象
+ * 
+ * 如果项目采用 0.6 之后的配置方式 (使用 koot.config.js，其中有全部配置项)，以下内容会写入环境变量
+ *   - KOOT_PROJECT_CONFIG_PATHNAME - 项目配置文件 (临时文件)
+ * 
+ * 项目配置：在 0.6 之前为 koot.js，0.6 之后为自动生成的临时配置文件
+ *   - 使用临时配置文件是为了兼容 0.6 之前的行为
+ *   - TODO: 在未来可能会抛弃独立配置文件行为，界时该方法会改写
+ * 
+ * @async
+ * @returns {Object} 打包配置对象
  */
 module.exports = async (projectDir = getCwd()) => {
 

packages/koot/locales/en.json

@@ -1,10 +1,16 @@
 {
     "file_not_found": "File not found: ${file}",
     "missing_option": "Please provide option ${option}.\n${indent}> ${example}",
+    "appType": {
+        "ReactApp": "React Isomorphic",
+        "ReactSPA": "React SPA"
+    },
     "build": {
         "config_type_error": "Error: build config file (${file}) must export ${type}",
         "build_start": "Start building: ${type} [STAGE ${stage} | ENV ${env}]",
+        "build_start_no_stage": "Start building: ${type} [ENV ${env}]",
         "build_complete": "Building complete: ${type} [STAGE ${stage} | ENV ${env}]",
+        "build_complete_no_stage": "Building complete: ${type} [ENV ${env}]",
         "building": "Webpack building...",
         "building_locale": "Webpack building (locale ${locale})...",
         "spa_template_emitted": "SPA HTML file emitted to ${file}",

packages/koot/locales/zh_cn.json

@@ -1,10 +1,16 @@
 {
     "file_not_found": "文件未找到：${file}",
     "missing_option": "请提供 ${option} 选项。\n${indent}> ${example}",
+    "appType": {
+        "ReactApp": "React 同构",
+        "ReactSPA": "React SPA"
+    },
     "build": {
         "config_type_error": "错误：打包配置文件（${file}）需输出 ${type}",
         "build_start": "开始打包：${type} [STAGE ${stage} | ENV ${env}]",
+        "build_start_no_stage": "开始打包：${type} [ENV ${env}]",
         "build_complete": "打包完成：${type} [STAGE ${stage} | ENV ${env}]",
+        "build_complete_no_stage": "打包完成：${type} [ENV ${env}]",
         "building": "Webpack 打包中……",
         "building_locale": "Webpack 打包中 (语种 ${locale})……",
         "spa_template_emitted": "SPA HTML 页面文件已输出至 ${file}",