WebpackNative, 자산 파이프라인 및 Webpackgem의 대체

왜 나는 웹 패키지와 자산 파이프라인을 좋아하지 않는가
나는 성실함에서 시작해야 한다. 나는 오래된 2핵컴퓨터 한 대를 가지고 있다. (네, 늙었어요) 위에서 웹 패키지를 사용하는 것은 악몽이다. 속도가 매우 느리기 때문에 나는 오랜 시간을 기다려야만 나의 자바스크립트가 컴파일되는 것을 볼 수 있다. 이것은 내가 웹 패키지를 사용하는 것을 좋아하지 않는 유일한 이유가 아니지만 vanilla 웹 패키지를 사용하는 것이 웹 패키지를 사용하는 것보다 훨씬 낫다.소방전이 어떻게 웹 패키지에서 vanilla 웹 패키지로 전환되어 구축 시간을 8:15초에서 3초 이하로 줄이는지 볼 수 있다. 그들은 이를 위해 아주 좋은 글을 썼다. https://firehydrant.io/blog/rails-without-webpacker
자산관은 내가 사람들이 일상적인 업무에서 직면하는 또 다른 문제를 보았다. 만약 당신의 번역이 어떤 원인으로 생산에서 실패한다면, 당신은GitHub 환매 협의에서 문제를 열고 영원히 기다려야 한다.공헌자로부터 답장을 받거나 더 많은 세부 사항을 물어보기를 원하지만, 제품 발송이 빨리 이루어져야 하는 세계에서 가장 큰 사람이 당신의 문제를 해결할 때까지 기다릴 필요가 없습니다. (고도로 활발한 지역 사회에만 적용되는 도구 웹 패키지를 사용해야 합니다.) 바로 이런 도구입니다.
그러니까 나한테 물어보면...왜 내가 이 보석을 만들어야 합니까?나는 두 가지 이유로 대답할 것이다.
1. 국면을 장악하고 싶다(Webpacker gem은 나에게 느리고 복잡하며 자산관이 때때로 이상하게 표현될 수 있다). 이 두 가지 방법을 사용하면 그 중 하나가 문제를 일으킬 수 있다.
2. 나는 간단함을 좋아한다. 나는 사람들이 그것보다 더 복잡한 보석을 창조하는 것을 보았다. 사비는 나에게 관심이 없는 것 같다. 나는 간단한 것을 좋아한다. 그래, 간단함을 유지하고 어리석음을 유지한다.)
그래서 내가 원하는 것은 기본적으로 나의 모든 자산 파일을 한 곳에 놓고 언제든지 컴파일할 수 있는 것이다. 만약에 내가 사용자 정의 설정이 필요하다면 설정 파일에 웹 패키지라는 파일이 있어야 한다.배치하다.js에서 당신은 당신이 필요로 하는 모든 것을 설정할 수 있습니다. 웹 패키지를 이해하려고 노력하는 사람들에게 웹 패키지에 관한 글beginners book을 썼습니다. 웹 패키지와 프로필을 효과적으로 사용하는 데 필요한 모든 기초 지식을 상세하게 소개했습니다.

웹팩 native gem은 어떻게 작동합니까?
Webpack Native gem은 마법이 아니에요!응용 프로그램/폴더 아래에 웹 패키지 native라는 언제든지 사용할 수 있는 자산 폴더를 복사하면 이 폴더에 웹 패키지가 있습니다.배치하다.js 파일과 패키지입니다.json 파일, 모든 모듈 의존항을 보여줍니다. (설치되면 node modules 폴더와 패키지 lock. json이 추가됩니다.) 웹 패키지를 알면 기본 파일인 것을 알고 있습니다. 다른 폴더는 'src' 폴더입니다. 이것은 저희 자산의 저장 위치입니다."src"폴더에서 고전적인javascripts, 스타일sheets, 이미지 폴더를 발견할 수 있습니다. 이 폴더에 익숙해진 것 같습니다.
이게 다야?아니오, 하지만 앞에 추가된 구조는 필요한 주요하고 중요한 것입니다. 그것이 바로 거기에 있습니다. 당신은 당신의 전단 코드와 추가 설정을 작성할 수 있습니다. 만약 당신이 그것을 필요로 한다면, 복잡한 것은 없습니다. 단지 간단한 기본 웹 폴더일 뿐입니다.
나머지는 자바스크립트와 스타일시트 표시를 출력하는 데 사용되는 도움말 프로그램입니다. 이것은gem에서 보기/레이아웃/응용 프로그램에 추가됩니다.html.직원 재교육국은 다음과 같습니다.

<%= webpack_stylesheet_url 'application', media: 'all', 'data-turbolinks-track': 'reload' %>

<%= webpack_javascript_url 'application', 'data-turbolinks-track': 'reload' %>

이미지의 경우 다음과 같이 웹팩 native/src/images 아래에 이미지를 놓고 뷰에서 사용할 수 있습니다.

<%= webpack_image_url('image.jpg') %>

그래서 기본적으로 웹팩 nativegem은 간단한 기본 구조를 만들고 자산을 배치하며 필요한 HTML 태그를 출력하는 데 도움을 줄 것입니다. 이렇게 간단합니다!

출력 파일
개발 과정에서(생산 과정에서) 귀하의 모든 자산은 응용 프로그램public/webpack_native 폴더에 들어갑니다. 기본적으로 설정이'개발'모드이기 때문에 귀하의 코드는 압축을 풀고 생산용으로 코드를 압축하려면 다음과 같이 실행하십시오.

rails g webpack_native:prod

이것은 단지 다음 작업을 수행하는 방법일 뿐입니다.

cd app/webpack_native
npm run build --mode=production

네가 좋아하는 모든 것을 사용해라. 마지막으로 그것은 일반적인 웹 패키지일 뿐이다. 첫 번째 방법은 조수 생성기일 뿐이다. 타자 시간을 절약할 수 있다.
웹팩 native gem 사용법은 다음과 같습니다. https://github.com/scratchoo/webpack_native
설명을 따르고, 그것을 사용하고, 차이를 보고, 내가 네가 그것을 좋아하거나 싫어하는지 알 수 있도록 해라.
마지막으로, 이 모든 것은 지역 사회에 보답하기 위해서입니다. scratchoo 우리는 우리가 자신을 위해 일하는 모든 유용한 것을 공유할 것이라고 믿습니다. 웹팩 Native는 우리가 우리의 발전을 가속화하기 위해 세운 새로운 도구입니다. 우리는 이에 대해 흥분했습니다. 그래서 그에게 좋은 점이 있다고 생각하면 친구와 공유하세요.