반응에서 파일 경로 별칭을 설정하는 구체적인 방법을 알고 있습니까?

기사 환경:

"react": "^16.13.1" 버전

동영상 공유 학습: react 동영상 튜토리얼

react 공식 스캐폴딩은 기본적으로 웹팩 구성을 숨깁니다. 이는 Expose webpack을 구성하기 전에 필요합니다. .

1. npm run extract

명령을 입력하면 명령 프롬프트가 나타납니다. 이것은 단방향 작업입니다. 작업을 확인한 후 되돌릴 수 없습니다.

y를 입력하고 Enter를 누르세요

It config 폴더

2 이후 프로젝트 루트 디렉토리에 나타납니다. config 폴더

3에서 webpack.config.js 파일을 엽니다. 아마도 291라인

에서 별칭을 검색하세요. 경로를 설정하려면 다음 형식을 참조하세요. 별칭

	alias: {
        // Support react Native Web
        // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
        'react-native': 'react-native-web',
        // Allows for better profiling with reactDevTools
        ...(isEnvProductionProfile && {
          'react-dom$': 'react-dom/profiling',
          'scheduler/tracing': 'scheduler/tracing-profiling',
        }),
        ...(modules.webpackAliases || {}),
        // 文件路径别名
        '@': path.resolve(__dirname, '../src'),
        '@view': path.resolve(__dirname, '../src/view'),
      },

에는 특별한 주의가 필요합니다. webpack 구성을 변경한 후 프로젝트를 다시 시작해야 합니다. 그렇지 않으면 적용되지 않습니다

5.

를 사용하여 index.js를 엽니다. import ./index.css를 import '@/index.css'

참고: @ src 파일 경로가 위에서 설정되었습니다

6. 프로젝트를 시작하면 오류가 보고되지 않습니다. 스타일이 적용됩니다

위 내용은 반응에서 파일 경로 별칭을 설정하는 구체적인 방법을 알고 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!