create-react-app 3.0发布

yarn create react-app my-app
"dependencies": {
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-scripts": "3.0.0"
}

3.0多了TypeScript文件lint,Jest 24支持,增加的功能里比较关注的一个是对React hooks的支持,另一个是可以通过配置jsconfig.json/tsconfig.json设置绝对路径~

要设置绝对路径import文件,vue中可以修改vue.config.js

chainWebpack: (config) => {  
    config.resolve.alias.set('@', resolve('src'));
}

3.0之前需要执行yarn run eject,在config/webpack.config.js文件中增加alias

yarn run eject会将create-react-app配置反编译到项目里,这样才能去改webpack的配置。可以看如何扩展 Create React App 的 Webpack 配置

alias: {
    //...
    '@': paths.appSrc
}

现在支持jsconfig.json之后,在项目目录下新建jsconfig.json文件,设置baseUrl就ok

{
  "compilerOptions": {
    "baseUrl": "src"
  }
}

import就能这么写

import './App.css';
import Test from './component/Test'

import 'App.css';
import Test from 'component/Test'

试了下baseUrl目前只支持src或node_modules,别的会报错

Your project's `baseUrl` can only be set to `src` or `node_modules`. Create React App does not support other values at this time.

不过有个src基本也够用了,比一堆../../../好太多去了

早些时候在github看到,说将来可能直接添加@作为src目录别名

Comments
Write a Comment
  • Xiaweiss reply

    不许要 Eject,react-app-rewired 了解一下