ASP.NET 코어 앵글 SPA 템플릿 추가 webpack.config.js에 사용자 정의 부트 스트랩 테마

Question

asp.net core spa 템플릿에 사용자 정의 부트 스트랩 템플릿을 추가해야합니다. 내가 명령을 사용하여 사원을 만들었습니다

dotnet new --install Microsoft.AspNetCore.SpaTemplates::* 
dotnet new angular 

내가 wwwroot 폴더에 배치 사용자 정의 bootrap 테마를 사용할 필요가 있지만, 생성 된 템플릿 내 요구에 맞는.

CustomTheme 
├── css 
│ ├── style.less 
├── js 
├── fonts 
├── img 

누군가이 테마를 webpack.config.vendor.js에 추가하는 방법을 설명해 주시겠습니까?

Answer 1

는 업데이트 :

어떻게 적은 빌드를 활성화도 잘 설명되어 있습니다

Example: A simple Webpack setup that builds LESS

이 게시물을, 브라이언 만치니에 의해, 도움 또는 각도에 유사하게 적용 할 수있는 반작용 SPA 템플릿에 관한 뿐만 아니라 SPA 템플릿 :

ASP.NET Core Bootstrap Customization

아래 요약을 복사 :

1. LESS와을 ClientApp 설정에서 덜 로더

   npm install --save less less-loader 
   

2. 다음 파일 및 폴더

   less/site.less 
   less/bootstrap/bootstrap.less 
   less/bootstrap/variables.less 
   

3. 구성 부트 스트랩과 변수를 설치 덜 파일

   /* less/bootsrap/bootstrap.less */ 
   /* import bootstrap from source */ 
   @import '../../../node_modules/bootstrap/less/bootstrap.less'; 
   
   /* import custom overrides */ 
   @import 'variables.less'; 
   
   
   
   /* less/bootstrap/variables.less */ 
   
   /* import the original file */ 
   @import '../../../node_modules/bootstrap/less/variables.less'; 
   
   
   /* Variables your overrides below 
   -------------------------------------------------- */ 
   
   
   
   
   /* less/site.less */ 
   @import './bootstrap/variables.less'; 
   /* your overrides below */ 
   

4. 수정 webpack.config.vendor.js

   CSS 파일 생성과 관련된 구성을 제거하십시오. 최종 공급 업체의 구성은 다음과 같이 표시됩니다

   이

   사이트를 포함하는 요점 webpack.config.js

5. 수정 boot-client.ts을 참조 적은 변환을 수행하고 부트 스트랩 요점 webpack.vendor.config.js

6. 수정 webpack.config.js을 참조 적은

   import './less/site.less'; 
   import './less/bootstrap/bootstrap.less'; 
   

7. 코드 서식에 문제가 bootstrap.css