Webpack 4가 분할 모듈로 취급하는 원시 JSON 파일을 배포하는 방법은 무엇입니까?

나는 이것이 드문 문제라고 생각하지 않지만 키워드가 많은 오탐을 일으키는 것 같습니다. "webpack 동적 구성 파일", "webpack 런타임로드 JSON 파일"등을 검색해 보았습니다. Webpack을 동적으로 구성한 결과는 많지만 번들 앱을 동적으로 구성한 결과는 많지 않습니다.

• 내 배포에 원시 JSON으로 배치되는 구성 파일을 갖고 싶습니다. 즉, Webpack 런타임이나 모듈 상용구가 없습니다. 유효한 JSON 파일입니다.

• 마치 모듈 인 것처럼 내 코드에서 JSON 구성을 "가져 오기"합니다. 예를 들면 다음과 같습니다.

  import config from './config.json'
  

• Webpack이 번들에서 JSON 파일을 생략하기를 원하지만 config.json서버 에서 대기 를 비동기 적으로 요청하고 주입하기 위해 필요한 코드를 삽입 합니다.

• Webpack ./config.json이 빌드시 존재 하는지 여부를 무시 하고 런타임시 올바른 위치에있을 것이라고 낙관적으로 가정하기를 원합니다 .

• './config.json'모듈 별칭을 지정할 수 있고 Webpack이 별칭이 지정된 파일을 config.json빌드 디렉토리 의 올바른 위치 (이름 포함 )에 복사 할 수 있다면 좋겠습니다 .

이렇게하면 내 사이트 관리자가 Webpack을 실행하지 않고도 편집 할 수있는 원시 JSON 파일이 배포에 제공됩니다. config.json일반 모듈 처럼 개발자 코드로 사용할 수 있습니다 . 어떻게 할 수 있습니까? 나는 사용 제안을 보았다

externals: {
  './config.json': "require('./config.prod.json')",
},

하지만 require존재하지 않는 브라우저에서는 작동하지 않습니다.

나는 운 없이이 구성을 시도했습니다. JSON은 여전히 ​​번들에 인라인됩니다.

resolve: {
  alias: {
    './config.json': path.resolve(__dirname, 'src/config.prod.json')
  }
},
optimization: {
  splitChunks: {
    cacheGroups: {
      config: {
        test: './config.json',
        chunks: 'all',
        name: 'config',
        priority: 100
      }
    }
  }
}

Webpack 4를 사용하고 있습니다.