React项目从Javascript到Typescript的迁移经验总结

提示不能使用jsx的语法

这个解决很简单，去tsconfig配置一下即可。

{  
   "compilerOptions":{  
        "jsx": "react"  
   }  
}  

jsx这个配置项有三个值可选择，分别是"preserve","react-native"和"react"。在preserve和react-native模式下生成代码中会保留JSX以供后续的转换操作使用（比如：Babel）。另外，preserve输出文件会带有.jsx扩展名，而react-native是.js拓展名。react模式会生成React.createElement，在使用前不需要再进行转换操作了，输出文件的扩展名为.js。

webpack里面配置的alias无法解析

module.exports = {  
    //省略部分代码...  
    resolve: {  
        alias:{  
          '@':path.join(__dirname,'../src')  
        }  
        //省略部分代码...      
    },  
    //省略部分代码...     
} 

这里需要我们额外在tsconfig.json配置一下。

{  
    "compilerOptions":{  
        "baseUrl": ".",  
        "paths": {  
          "@/*":["./src/*"]  
        }   
    }  
}  

具体如何配置，请看typescript的文档,我就不展开介绍了，但是要注意的是baseUrl和paths一定要配合使用。

https://www.tslang.cn/docs/ha...

无法自动添加拓展名而导致找不到对应的模块

原先我们在webpack里是这么配置的：

module.exports = {  
    //省略部分代码...   
    resolve: {  
        //省略部分代码...   
        extensions: ['.js', '.jsx', '.json']  
    },  
    //省略部分代码...   
}  

（编辑：西安站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!