合并冲突在React Typescript项目中如何有效

Question

我发现下面粘贴的代码签入了我们的React / Typescript-JSX / TSX项目。 它包含一个Git合并冲突，尚未解决。

该代码将构建（通过保险丝盒）并在浏览器中运行！

“已编译”代码导致将top元素解析为组件的根元素，而忽略第二个元素（“ .app-container”开始）。

看起来，在某些情况下，可以通过TSX / JSX解释/解析/转译来忽略git合并冲突。

我的问题是：这项工作如何进行？ 这种行为是故意的吗？

export const App: SFC = () => (
<<<<<<< HEAD
    <Provider store={window.uglySolution}>
        <Router history={customHistory}>
            <Switch>
                <Route exact path='/' component={Welcome}/>
                <Route exact path='/advice' component={PageLayout}/>
                <Route exact path='/login' component={Login}/>
                <Route exact path='/manage' component={ManageLayout}/>
            </Switch>
        </Router>
    </Provider>
=======
    <div className='app-container'>
        <Provider store={window.uglySolution}>
            <Router history={customHistory}>
                <Switch>
                    <Route exact path='/' component={Welcome}/>
                    <Route exact path='/advice' component={PageLayout}/>
                    <Route exact path='/login' component={Login}/>
                    <Route exact path='/manage' component={ManageLayout}/>
                </Switch>
            </Router>
        </Provider>
    </div>
>>>>>>> f81b0b1b458e3d41f91faa2e726be6d88a35d9f8
);

Answer 1

我知道这是一个很晚的答案（将近一年后），但万一有人正在使用谷歌搜索并想知道同一件事。 是的，在打字稿词法分析器中故意存在代码的行为来处理git合并冲突！ 注意：在解析器上，跳过琐事默认为true。

if (isConflictMarkerTrivia(text, pos)) {
  pos = scanConflictMarkerTrivia(text, pos, error);
  if (skipTrivia) {
    continue;
}
else {
    return token = SyntaxKind.ConflictMarkerTrivia;
  }
}

下面是处理合并冲突的代码：

function scanConflictMarkerTrivia(text: string, pos: number, error?: (diag: DiagnosticMessage, pos?: number, len?: number) => void) {
    if (error) {
        error(Diagnostics.Merge_conflict_marker_encountered, pos, mergeConflictMarkerLength);
    }

    const ch = text.charCodeAt(pos);
    const len = text.length;

    if (ch === CharacterCodes.lessThan || ch === CharacterCodes.greaterThan) {
        while (pos < len && !isLineBreak(text.charCodeAt(pos))) {
            pos++;
        }
    }
    else {
        Debug.assert(ch === CharacterCodes.bar || ch === CharacterCodes.equals);
        // Consume everything from the start of a ||||||| or ======= marker to the start
        // of the next ======= or >>>>>>> marker.
        while (pos < len) {
            const currentChar = text.charCodeAt(pos);
            if ((currentChar === CharacterCodes.equals || currentChar === CharacterCodes.greaterThan) && currentChar !== ch && isConflictMarkerTrivia(text, pos)) {
                break;
            }

            pos++;
        }
    }

    return pos;
}

资料来源： https : //github.com/Microsoft/TypeScript/blob/0ef0b7adea643a4a28cf9ada1476ff5650a1a9f2/src/compiler/scanner.ts#L1604 https://github.com/Microsoft/TypeScript/blob/0ef0b7adea643a4a28cf9ada1476ff5650a1com9er ＃L565

Answer 2

看起来，在某些情况下，可以通过Tax / JSX解释/解析/转译来解决git合并冲突。

给定的代码是编译错误 。 那就是说编译错误并不意味着您不会生成任何JS 。 有一个选项noEmitOnError可以防止这种情况的发生，但这表示即使没有此选项，您也应该看到编译错误并进行修复。

更多

https://basarat.gitbooks.io/typescript/content/docs/why-typescript.html