🕵️때때로 새로운 것이 있다: 아침식사를 시도하다🍴

10004 단어 webdev node javascript operations

(식품 관련 게시물은 이미 통제력을 잃었다.)
나는 이번 주에 무엇을 써야 할지 모르겠다.나는 그렇게 많은 새로운 것을 배우지 못했다. 나는 내가 너희들과 무엇을 나눌 수 있는지 모르겠다.그래서 나는'왜 내가 아직 모르는 것을 시도하지 않고 기록해서 변화를 꾀하지 않는가?'라고 생각했다.내가 그랬어.
제가 유행하는 검색엔진에 갔어요.™ "2021년 JS의 최고급 구축 도구"를 입력하고 내가 본 첫 번째 링크를 클릭하세요.웹 패키지심심했어삼키다나는 사람들이 여전히 그것을 사용하고 있다고 믿지만, 나는 이미 몇 년 동안 쓸모가 없다. 이것은 자격에 부합되지 않는다.꼬르륵똑같아요.소포랑 소포?네, 예전에 써 봤어요. 좋아해요. 그런데 아직 낯설지 않아요.아침 점심?여태껏 들어 본 적이 없다.완벽해.

한 번 봅시다.

website 희망적:

Seeing your build tool in nightmares? Try Brunch!
Brunch lets you focus on what matters most — solving real problems instead of messing around with the glue.

그래!나는 Github repository에 가서 그 물건이 아직 활동 상태에 있는지 보았다.마지막 제출일은 2021년 2월 18일이다.소리가 변하지 않는다.문제 수?143 내가 이 글을 쓸 때.아마도 나는 그중의 일부를 만날 것이다. 그러나 헤헤: 네가 시도하기 전에 아니라고 말하지 마라. 그렇지?
Tailwind(PostSS 포함)와 AlpineJS를 포함한 작은 사이트를 만들어 보겠습니다.

시작

그럼 가자.나는 보통 한 가지 일의 모든 문서를 먼저 보지 않는다. 나는 손을 더럽히고 싶다.그래서 우리는 npm init 작은 프로젝트와 npm i 몇 개의 가방을 가지고 이 공구에 진정으로 포장할 수 있는 물건이 생겼다.즉 tailwindcss 및 alpinejs입니다.나도 브런치를 설치한다. 왜냐하면, 응, 그렇기 때문이다.
aaaand, 내가 먼저 문서를 읽어야 돼.분명히 나는 전 세계적으로 브런치를 설치하고 그것을 이용하여 프로젝트를 만들어야 한다.나는 지금 두 가지 선택이 있다. rm -rf 프로젝트 목록, 처음부터 시작하거나, 그것을 흐트러뜨리려고 한다.내가 손 더럽히는 거 좋아한다고 했어?내가 어떤 옵션을 선택했는지 알아맞혀 봐.
진찰을 받다.분명히 init 명령이 한 것은 복제일 뿐이다repository from Github.그래서 나는 기본적으로 거기에서 약간의 물건을 복사/붙일 수 있다. 나는 매우 좋다. 그렇지?우리 이렇게 하자.
추가 소포가 필요합니다.

npm i --save-dev auto-reload-brunch babel-brunch babel-preset-latest clean-css-brunch uglify-js-brunch

지금까지 줄곧 괜찮았다.npm audit 나에게 auto-reload-brunch 중 낮은 심각성 구멍이 하나밖에 없다고 말했다.이것은 나에게 큰 영향을 주지 않을 것이다. 왜냐하면 자동으로 다시 불러오는 물건은 어쨌든 내장된 버전에 나타나지 않기 때문이다. 그러기를 바란다.
현재 프로젝트 루트 디렉터리에는 brunch-config.js 파일이 필요합니다.이 재구매 계약서에 있는

// See http://brunch.io for documentation.
exports.files = {
  javascripts: {
    joinTo: {
      'vendor.js': /^(?!app)/, // Files that are not in `app` dir.
      'app.js': /^app/
    }
  },
  stylesheets: {joinTo: 'app.css'}
};

exports.plugins = {
  babel: {presets: ['latest']}
};

기다리다

// See http://brunch.io for documentation.

그래, 그래, 알아...
알겠습니다. 골격에 따라, 저는 지금 app 폴더가 필요합니다. 그 폴더에는 JS 파일과 CSS 파일이 포함되어 있습니다.색인을 포함하는 자산 폴더도 있습니다.html.HTML 파일 자산을 정확히 고려하지는 않겠지만, 헤헤.아마도 그것은 확실히 우세할 것이다.다시 복사/붙여넣기이론적으로, 이것은 응용 프로그램을 실행하기에 충분해야 한다. 그렇지?우리 한번 해 볼까요?

Drumroll 제발...

좋아, 희망이 있어 보여!
네, 로고는 불러오지 않지만, 전반적으로 말하면 효과가 있습니다.네가 본 공급업체의 잘못은 내가 저지른 잘못이다.구성의 입력 오류입니다.모듈을 다시 로드해 보겠습니다.

이 기본 설정은 나를 깜짝 놀라게 했다. 70-100밀리초는 재건에 쓰입니까?너무 빨라!지금까지 이 일은 보기에 매우 희망적이다.

플러그인을 넣습니다.

대다수의 '이렇게 간단하고 빠르다' 는 도구는 모두 약간의 결점이 있다.일부 유인 장치는 그것의 대부분 우세를 말살할 것이다.나는 아침 점심이 어디에 있는지 알고 싶다.혹시 플러그인에?어디 보자.어쨌든, 나는 포스터 플러그인이 필요하다. 그렇지 않으면 순풍이 정상적으로 작동하지 못하게 할 것이다.브런치 사이트에 nice searchable list of plugins가 있는데 2019년 12월 이후 건드리지 않았던 PostSS 플러그인을 찾을 수 있다.응, 무슨 문제가 생길 거야, 그렇지?설치, 순풍 추가, 무슨 일이 일어날지 보자.
분명히 이론적으로 이 줄을 플러그인 설정에 추가하는 것은 가능할 것이다.

// ...
  postcss: {
    processors: [
      require('tailwindcss')('./tailwind.config.js')
    ]
  }
// ...

빈 것도 추가했어tailwind.config.js.지수를 조정합시다.자산 중의 html 파일(나는 여전히 그것이 왜 거기에 속하는지 모르겠다)은 약간 실제적으로tailwind를 사용한다.

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>Brunch</title>
  <link rel="stylesheet" href="/app.css">
  <script src="/vendor.js"></script>
  <script src="/app.js"></script>
  <script>require('initialize');</script>
</head>
<body>

<div class="container my-16 mx-auto">
  <h1 class="text-4xl mb-4">
    Hello, World!
  </h1>

  <p class="text-xl mb-4">
    Lorem ipsum dolor sit amet
  </p>
</div>
</body>

다시 로드, aaa 및:

잘못이 없고, 아무것도 없고, 모든 것이 정상이다.그래, 번역 시간이 7.4s에 이르렀지만, 이것은 아침 점심의 잘못이 아니야!나는 혼합물에 순풍을 넣었다.알프스 산을 끌어들이는 것을 통해 나의 속도가 얼마나 느린지 알고 싶다.

import 'alpinejs'

8.2초--괜찮아요.대부분의 지출이 바벨일 수도 있다는 것을 감안하여 아침 점심은 그의 빠른 약속을 이행했다.디스플레이의 컴파일 시간은 여전히 80밀리초에서 100밀리초 사이이며, 이것은 상당히 빠르다.

요약(10분 추가...)

나는 이 일이 약속을 지키는 것이라고 매우 확신한다.그것은 이미 만들어진 많은 물건을 제공하지는 않았지만, 대량의 플러그인은 많은 일을 빨리 완성하기에 충분하다.구성 부분은 실제로 내가 발견한 가장 인상적인 부분이다.

이 두 가지 배치는 기본적으로 같은 결과를 실현하였다.config의 스타일은 나로 하여금 Webpack에 대한 Nuxt의 역할을 떠올리게 했다. 명령식 스타일이 아니라 성명식 스타일과 같다.
요컨대brunch는 대량의 플러그인을 통해 확장할 수 있는 신뢰할 수 있는 구축 도구인 것 같다.나는 여전히 Github에서 143개 문제 중 하나를 만났으면 좋겠지만, 그리 빠르지는 않다.HTML을 편집할 때 약간 불안정한 느낌이 들더라도 자동으로 다시 로드할 수 있는 속도가 매우 빠릅니다.나는 현재 아침 점심의 사용 상황이 어떠한지 확실하지 않지만, 그것은 유지보수를 받은 것 같아서, 나 혼자 일하는 작은 프로젝트에 대해, 나는 아침 점심을 사용해도 무방하다.
나는 네가 이 문장을 즐겨 읽기를 바란다. 마치 내가 그것을 즐겨 쓰는 것과 같다.하면, 만약, 만약...❤️ 혹은🦄! 나는 여가 시간에 과학 기술 문장을 쓰고 가끔 커피를 즐겨 마신다.
만약 당신이 나의 노력을 지지하고 싶다면, buy me a coffee ☕ 또는!너도 Paypal를 통해 나를 직접 지지할 수 있어!

Reference

이 문제에 관하여(🕵️때때로 새로운 것이 있다: 아침식사를 시도하다🍴), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/thormeier/something-new-every-now-and-then-trying-brunch-109

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)

A - Max Sum Plus Plus——POJ

ROS noetic에서 catkin build 사용

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다