feat(alita): 添加alita转化出错的 友好提示信息

Author: ykforerlang

src/packByWebpack/gatherInfo-loader.ts

@@ -31,6 +31,13 @@ export default function (this: webpack.loader.LoaderContext,  context: string):
 
     console.log(`开始处理：${filepath.replace(configure.inputFullpath, '')} ...`.info)
     const ast = parseCode(context, npath.extname(filepath))
+
+    //TODO 暂时通过此方式，让ast和sourceCode/filepath 建立联系
+    // @ts-ignore
+    ast.__sourceCode = context
+    // @ts-ignore
+    ast.__filepath = filepath
+
     const {isEntry, isRF, isFuncComp, imports, exports, JSXElements} = getFileInfo(ast, filepath)
 
     setModuleInfo(filepath, imports, exports, isRF, isEntry, JSXElements)

src/tran/addEventHandler.js

@@ -5,12 +5,13 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
- 
-import traverse from "@babel/traverse";
+
+import errorLogTraverse from '../util/ErrorLogTraverse'
+
 import * as t from "@babel/types"
 
 export default function touchableToView (ast) {
-    traverse(ast, {
+    errorLogTraverse(ast, {
         exit: path => {
             if (path.type === 'JSXOpeningElement'
                 && path.node.name.name === 'view'

src/tran/addTempName.js

@@ -5,15 +5,15 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
- 
-import traverse from "@babel/traverse";
+
+import errorLogTraverse from '../util/ErrorLogTraverse'
 import * as t from "@babel/types"
 import {InnerTemplateNamePrefix} from "../constants";
 import {isJSXChild, isChildCompChild} from "../util/uast";
 import {geneOrder} from '../util/util'
 export default function addTempName (ast) {
     const go = geneOrder()
-    traverse(ast, {
+    errorLogTraverse(ast, {
         exit: path => {
             if (path.type === 'JSXElement'
                 && (!isJSXChild(path) || isChildCompChild(path))

src/tran/addWXPrefixHandler.ts

@@ -6,7 +6,8 @@
  *
  */
 
-import traverse from "@babel/traverse";
+//import traverse from "@babel/traverse";
+import errorLogTraverse from '../util/ErrorLogTraverse'
 import {RNCOMPSET} from "../constants";
 import * as t from "@babel/types";
 
@@ -19,7 +20,7 @@ import {textComp} from '../util/getAndStorecompInfos'
  */
 export default function addWXPrefixHandler (ast, info?: any) {
     let hasTextInner = false
-    traverse(ast, {
+    errorLogTraverse(ast, {
         exit: path => {
             if (path.type === 'JSXOpeningElement') {
                 addWXPrefix(path)

src/tran/childrenToTemplate.js

@@ -5,8 +5,8 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
- 
-import traverse from "@babel/traverse";
+
+import errorLogTraverse from '../util/ErrorLogTraverse'
 import * as t from "@babel/types"
 
 import {geneOrder} from '../util/util'
@@ -93,7 +93,7 @@ export default function childrenToTemplate(ast, info) {
     const goForCTNP = geneOrder()
     const goForCTDK = geneOrder()
 
-    traverse(ast, {
+    errorLogTraverse(ast, {
 
         exit: path => {
 

src/tran/classNameHandler.js

@@ -6,7 +6,8 @@
  *
  */
 
-import traverse from "@babel/traverse";
+import errorLogTraverse from '../util/ErrorLogTraverse'
+
 import * as t from "@babel/types"
 
 /**
@@ -17,7 +18,7 @@ import * as t from "@babel/types"
  */
 export default function classNameHandler (ast,info) {
 
-    traverse(ast, {
+    errorLogTraverse(ast, {
         exit: path => {
             if (path.type === 'JSXOpeningElement'
                 && path.node.name.name === 'view'

src/tran/compOutElementToBlock.js

@@ -5,13 +5,14 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
- 
-import traverse from "@babel/traverse";
+
+import errorLogTraverse from '../util/ErrorLogTraverse'
+
 
 export default function addTempName (ast, info) {
     if (info.isPageComp) return ast
 
-    traverse(ast, {
+    errorLogTraverse(ast, {
         exit: path => {
             if (path.type === 'JSXOpeningElement'
                 && path.node.name.name === 'view'

src/tran/compPreHandle.js

@@ -5,8 +5,9 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
- 
-import traverse from "@babel/traverse";
+
+import errorLogTraverse from '../util/ErrorLogTraverse'
+
 import * as t from "@babel/types"
 
 
@@ -25,7 +26,7 @@ import * as t from "@babel/types"
  * @returns {*}
  */
 export default function compPreHandle(ast, info) {
-    traverse(ast, {
+    errorLogTraverse(ast, {
         exit: path => {
             // 移除注释
             if (path.node.leadingComments) {

src/tran/cptCompHandler.js

@@ -5,8 +5,8 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
- 
-import traverse from "@babel/traverse"
+
+import errorLogTraverse from '../util/ErrorLogTraverse'
 import {InnerComponentNamePrefix, RNCOMPSET} from "../constants"
 import * as t from "@babel/types"
 import {geneOrder, getGenericName} from "../util/util"
@@ -17,7 +17,7 @@ import {jsxPropsMap} from '../util/getAndStorecompInfos'
 export default function cptCompHandler (ast, info) {
     const ALLCPTCOMPMAP = jsxPropsMap
     const go = geneOrder()
-    traverse(ast, {
+    errorLogTraverse(ast, {
         enter: path => {
             // 处理直接是<V>{this.props.children}</V> 这种情况
             if (path.type === 'JSXExpressionContainer'

src/tran/funcCompToClassComp.ts

@@ -6,10 +6,11 @@
  *
  */
 
-import traverse from "@babel/traverse";
+//import traverse from "@babel/traverse";
 import * as t from "@babel/types";
 import {isReactComponent} from "../util/uast";
 import configure from '../configure'
+import errorLogTraverse from '../util/ErrorLogTraverse'
 
 /**
  * 把函数声明的组件， 转化为FuncComponent 组件
@@ -41,7 +42,7 @@ export default function funcCompToClassComp(ast, info) {
 
     let comps = new Set([])
 
-    traverse(ast, {
+    errorLogTraverse(ast, {
         enter: path => {
 
             // function x {}

src/tran/geneAllTemplate.js

@@ -5,8 +5,9 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
- 
-import traverse from '@babel/traverse';
+
+import errorLogTraverse from '../util/ErrorLogTraverse'
+
 import * as t from '@babel/types'
 import {decTemlate, isBindElement, isJSXChild, isChildCompChild, isChildComp} from '../util/uast';
 import { isEventProp } from '../util/util';
@@ -19,7 +20,7 @@ import { isEventProp } from '../util/util';
  */
 export default function(ast, info) {
 
-    traverse(ast, {
+    errorLogTraverse(ast, {
         exit: path => {
             if (path.type === 'JSXOpeningElement'
                 && path.node.name.name === 'view') {

src/tran/literalTemplate.js

@@ -6,7 +6,8 @@
  *
  */
 
-import traverse from "@babel/traverse";
+import errorLogTraverse from '../util/ErrorLogTraverse'
+
 import * as t from "@babel/types"
 import {isTextElement} from '../util/uast'
 
@@ -18,7 +19,7 @@ import {isTextElement} from '../util/uast'
  */
 export default function literalTemplate (ast, info) {
 
-    traverse(ast, {
+    errorLogTraverse(ast, {
         exit: path => {
             if (path.type === 'JSXElement'
                 && isTextElement(path.node.openingElement)

src/util/ErrorLogTraverse.ts

@@ -0,0 +1,57 @@
+import traverse from "@babel/traverse"
+import { codeFrameColumns } from '@babel/code-frame'
+
+import configure from '../configure'
+
+export default function myTraverse (ast, opts) {
+
+
+    const newOpts = wrappCatchOpts(ast, opts)
+
+    traverse(ast, newOpts)
+}
+
+
+function wrappCatchOpts(ast, opts) {
+
+    const newOpts = {}
+
+    const allKeys = Object.keys(opts)
+    for(let i = 0; i < allKeys.length; i ++ ) {
+        const k = allKeys[i]
+        const v = opts[k]
+
+        if (typeof v === 'function') {
+            newOpts[k] = wrapperCatch(ast, v)
+        } else {
+            newOpts[k] = v
+        }
+    }
+
+    return newOpts
+}
+
+function wrapperCatch(ast, func) {
+    return function (...args) {
+        try {
+            return func(...args)
+        } catch(e) {
+
+            const relativeFilePath = ast.__filepath.replace(configure.inputFullpath, '')
+            const code = ast.__sourceCode
+
+            const loc = args[0].node.loc
+            const result = codeFrameColumns(code, loc, {
+                highlightCode: true,
+                linesAbove: 2,
+                linesBelow: 2,
+            });
+            console.log(`${relativeFilePath} 转化出错，这可能是alita本身的bug，please submit an issue with below infomations。`.error)
+            console.log(`代码片段:\n`.error, result)
+            console.log(`异常信息:\n`.error, e)
+
+            throw e
+        }
+    }
+}
+