feat: ts 支持类型校验

ximing · Apr 24, 2019 · 99a41e0 · 99a41e0
1 parent dd1499d
commit 99a41e0
Show file tree

Hide file tree

Showing 10 changed files with 89 additions and 25 deletions.
diff --git a/src/assetManager.js b/src/assetManager.js
@@ -3,6 +3,7 @@
  */
 const chalk = require('chalk');
 const fse = require('fs-extra');
+const notifier = require('node-notifier');
 
 const Asset = require('./asset');
 const log = require('./log');
@@ -54,7 +55,20 @@ module.exports = class AssetManager {
                                 return asset;
                             },
                             (err) => {
-                                console.error(err);
+                                if (this.mpb.isWatch) {
+                                    notifier.notify({
+                                        title: 'beforeEmitFile hooks error',
+                                        message: '输出文件失败，具体错误请查看命令行'
+                                    });
+                                    console.log(
+                                        chalk.red('[beforeEmitFile hooks error]'),
+                                        asset.path
+                                    );
+                                    console.error(err);
+                                } else {
+                                    console.error(err);
+                                    process.exit(1);
+                                }
                                 // throw err;
                             }
                         );
@@ -66,6 +80,7 @@ module.exports = class AssetManager {
                         .catch((_) => asset);
                 },
                 (err) => {
+                    console.log('asset', asset.path);
                     console.error(err);
                     // throw err;
                 }

diff --git a/src/index.js b/src/index.js
@@ -28,6 +28,7 @@ const CopyImagePlugin = require('./plugin/copyImagePlugin');
 const ProjectConfigPlugin = require('./plugin/projectConfigPlugin.js');
 const CopyPlugin = require('./plugin/copyPlugin');
 const CleanMbpPlugin = require('./plugin/cleanMbpPlugin.js');
+const TsTypeCheckPlugin = require('./plugin/tsTypeCheckPlugin');
 const NodeEnvironmentPlugin = require('./node/NodeEnvironmentPlugin');
 
 class Mpbuilder {
@@ -114,3 +115,4 @@ module.exports.CopyPlugin = CopyPlugin;
 module.exports.CopyImagePlugin = CopyImagePlugin;
 module.exports.ProjectConfigPlugin = ProjectConfigPlugin;
 module.exports.CleanMbpPlugin = CleanMbpPlugin;
+module.exports.TsTypeCheckPlugin = TsTypeCheckPlugin;
diff --git a/src/loader/ts-loader-next/gulp-typescript-compile-queue.js b/src/loader/ts-loader-next/gulp-typescript-compile-queue.js
@@ -31,7 +31,7 @@ function tsCompileQStream(project, reporter) {
             this.signal = CompileScheduler.scheduleCompilation(project, () => {
                 this.transformStream = project(reporter).on('finish', () => this.signal());
 
-                const compileStream = src.pipe(this.transformStream);
+                let compileStream = src.pipe(this.transformStream);
                 compileStream.js.pipe(this.js);
                 compileStream.dts.pipe(this.dts);
             });
@@ -50,7 +50,7 @@ CompileScheduler.scheduleCompilation = function(project, beginCompilation) {
         projectQueue = [];
         CompileScheduler.compileGateKeeper.set(project, projectQueue);
     }
-    const ret = CompileScheduler.startNext(project);
+    let ret = CompileScheduler.startNext(project);
     if (projectQueue.length) {
         projectQueue.push(beginCompilation);
     } else {
@@ -62,9 +62,9 @@ CompileScheduler.scheduleCompilation = function(project, beginCompilation) {
 
 CompileScheduler.startNext = function(project) {
     return () => {
-        const projectQueue = CompileScheduler.compileGateKeeper.get(project);
+        let projectQueue = CompileScheduler.compileGateKeeper.get(project);
         if (projectQueue.length) {
-            const nextCompilation = projectQueue.shift();
+            let nextCompilation = projectQueue.shift();
             nextCompilation();
         }
     };

diff --git a/src/loader/ts-loader-next/index.js b/src/loader/ts-loader-next/index.js
@@ -6,21 +6,21 @@ const ts = require('gulp-typescript');
 const through = require('through2');
 const plumber = require('gulp-plumber');
 const PQueue = require('p-queue');
-
 const queue = new PQueue({ concurrency: 1 });
 
 // const tsCompileQStream = require('./gulp-typescript-compile-queue');
 
 module.exports = function(opts = {}) {
     const tsProject = ts.createProject('tsconfig.json');
     return async function(asset) {
-        // Solution to "Error: gulp-typescript: A project cannot be used in two compilations * at the same time. Create multiple projects with createProject instead."  https://gist.github.com/smac89/49f3b076cd987e0875ba9bfb3fe81ef9 not work
+        //Solution to "Error: gulp-typescript: A project cannot be used in two compilations * at the same time. Create multiple projects with createProject instead."  https://gist.github.com/smac89/49f3b076cd987e0875ba9bfb3fe81ef9 not work
         let errorCount = 0,
             file;
         asset.contents = await queue.add(
             () =>
                 new Promise((res) => {
-                    gulp.src(asset.path)
+                    gulp
+                        .src(asset.path)
                         .pipe(
                             plumber({
                                 errorHandler() {

diff --git a/src/loaderManager.js b/src/loaderManager.js
@@ -41,6 +41,7 @@ module.exports = class LoaderManager {
                             try {
                                 await loaderInstance.call(this.mpb, asset);
                             } catch (e) {
+                                console.error(e);
                                 asset.contents = null;
                                 asset.shouldOutput = false;
                                 break;
@@ -63,7 +64,7 @@ module.exports = class LoaderManager {
         this.rules = [];
         for (let i = this.mpb.config.module.rules.length - 1; i >= 0; i--) {
             const rule = this.mpb.config.module.rules[i];
-            const { use, test, exclude, include } = rule;
+            let { use, test, exclude, include } = rule;
             for (let j = use.length - 1; j >= 0; j--) {
                 const { loader, options } = use[j];
                 if (!use[j].loaderInstance) {

diff --git a/src/plugin/cleanMbpPlugin.js b/src/plugin/cleanMbpPlugin.js
@@ -18,11 +18,7 @@ module.exports = class CleanMbpPlugin {
     apply(mpb) {
         mpb.hooks.start.tapPromise('CleanMbpPlugin', async () => {
             if (Array.isArray(this.options.path) && this.options.path.length > 0) {
-                console.log(
-                    chalk.gray('[CleanMbpPlugin]: '),
-                    chalk.blue('删除文件:'),
-                    this.options.path
-                );
+                console.log(chalk.gray('[CleanMbpPlugin]: '), chalk.blue('删除文件:'), this.options.path);
                 await del(this.options.path);
             }
             return Promise.resolve();

diff --git a/src/plugin/minifyPlugin.js b/src/plugin/minifyPlugin.js
@@ -5,16 +5,19 @@
 // const jsonminify = require('jsonminify');
 // const htmlmin = require('html-minifier');
 const workerpool = require('workerpool');
-
 const pool = workerpool.pool();
 
 function minifyJS(contents) {
     const UglifyJS = require('uglify-js');
     const result = UglifyJS.minify(contents);
-    if (result.error) console.error('[MinifyPlugin]', result.error);
+    if (result.error) {
+        console.error('[MinifyPlugin]', result.error);
+        throw result.error;
+    }
     if (result.warnings) console.warn('[MinifyPlugin]', result.warnings);
     return result.code;
 }
+
 function minifyWXML(contents) {
     const htmlmin = require('html-minifier');
     return htmlmin.minify(contents, {
@@ -24,6 +27,7 @@ function minifyWXML(contents) {
         caseSensitive: true
     });
 }
+
 function minifyJSON(contents) {
     const jsonminify = require('jsonminify');
     return jsonminify(contents).toString();

diff --git a/src/plugin/projectConfigPlugin.js b/src/plugin/projectConfigPlugin.js
@@ -27,10 +27,7 @@ module.exports = class ProjectConfigPlugin {
             const projectConfigFile = path.join(distDir, 'project.config.json');
             const isExist = fs.existsSync(projectConfigFile);
             if (!isExist) {
-                console.log(
-                    chalk.gray('[ProjectConfigPlugin]: '),
-                    chalk.blue('project.config.json 不存在，重新生成')
-                );
+                console.log(chalk.gray('[ProjectConfigPlugin]: '), chalk.blue('project.config.json 不存在，重新生成'));
                 await fse.outputJson(projectConfigFile, {
                     description: '项目配置文件',
                     packOptions: {
@@ -74,11 +71,8 @@ module.exports = class ProjectConfigPlugin {
                         }
                     }
                 });
-            } else {
-                console.log(
-                    chalk.gray('[ProjectConfigPlugin]: '),
-                    chalk.blue('project.config.json 存在，不需要重新生成')
-                );
+            }else{
+                console.log(chalk.gray('[ProjectConfigPlugin]: '), chalk.blue('project.config.json 存在，不需要重新生成'));
             }
             return Promise.resolve();
         });

diff --git a/src/plugin/tsTypeCheckPlugin.js b/src/plugin/tsTypeCheckPlugin.js
@@ -0,0 +1,51 @@
+/**
+ * Created by ximing on 2019-04-18.
+ */
+const TscWatchClient = require('tsc-watch/client');
+const notifier = require('node-notifier');
+const chalk = require('chalk');
+
+module.exports = class TsTypeCheckPlugin {
+    constructor(options) {
+        this.options = Object.assign(
+            {},
+            {
+                project: process.cwd(),
+                kill: true
+            },
+            options
+        );
+    }
+
+    apply(mpb) {
+        const watch = new TscWatchClient();
+
+        watch.on('first_success', () => {
+            if (!mpb.isWatch) {
+                watch.kill();
+            }
+        });
+
+        watch.on('subsequent_success', () => {
+            // Your code goes here...
+        });
+
+        watch.on('compile_errors', () => {
+            if (mpb.isWatch) {
+                notifier.notify({
+                    title: 'typescript-error',
+                    message: 'typescript类型校验出错！'
+                });
+            } else {
+                // 如果编译报错，不是watch模式下就直接退出进程
+                console.error('[TsTypeCheckPlugin]', chalk.red('ts编译报错'));
+                if (this.options.kill) {
+                    watch.kill();
+                    process.exit(100);
+                }
+            }
+        });
+
+        watch.start('--noClear', '--project', this.options.project, '--watch', '--noEmit');
+    }
+};
diff --git a/src/watching.js b/src/watching.js
@@ -98,6 +98,7 @@ module.exports = class Watching {
         const asset = this.mpb.assetManager.getAsset(path);
         if (asset) {
             if (type === 'change') {
+                console.log('[watching-add-asset]',path)
                 await this.mpb.assetManager.addAsset(path, asset.outputFilePath, asset.meta);
             } else if (type === 'unlink') {
                 await this.mpb.assetManager.delAsset(asset);