2017-08-05 독서노트(Webpack 학습노트2)

1494 단어
오늘 마지막으로 배운 웹팩을 이어가겠습니다.오늘은 주로 자신의 건설과 실전이기 때문에 글이 많지 않을 것이다.
문장은 이 입문 Webpack, 이 편만 보면 충분해.
내가 이 글의 내용에 따라 직접 조작한 것을 감안하여 구체적인 절차는 복제하지 않고 단지 자신의 느낌과 자신이 조회한 것만 기록할 것이다.
  • 문장에서 아래의 명령행은 두 쪽을 반복해서 썼다.집행하지 않아도 된다. 만약 집행하거나 잘못 보고를 알려준다면 잘못 보고한 원인은 이름이 바뀌었기 때문에 보통 두 번 집행할 필요가 없다.

  • npm install --save-dev webpack
  • 저는 맥을 사용했습니다. 오른쪽 키(두 손가락으로 클릭한 이벤트, 저는 오른쪽 키라고 부른다)는 새 파일이라는 옵션이 없습니다. 제가 찾아봤는데 명령행을 사용할 수 있어서 매우 편리합니다.
  • touch fileName.js
    
  • 문장 중 다음 단락의 패키지.json의 설정에서 주석을 삭제해야 합니다. 그렇지 않으면 오류가 발생합니다.
  • {
      "name": "webpack-sample-project",
      "version": "1.0.0",
      "description": "Sample webpack project",
      "scripts": {
        "start": "webpack" //          ,    npm start    webpack  
      },
      "author": "zhang",
      "license": "ISC",
      "devDependencies": {
        "webpack": "^1.12.9"
      }
    }
    
  • Webpack의 특징 중 하나는 Source Maps를 생성하여 웹 패키지의 프로필에 source maps를 설정할 수 있다는 것이다. devtool을 설정해야 하는데 다음과 같은 네 가지 다른 설정 옵션이 있는데 각각의 장점과 단점이 있다.각각source-map,cheap-module-source-map,eval-source-map과cheap-module-eval-source-map이다. 이 네 가지는 포장 속도가 점점 빨라지지만 동시에 점점 더 많은 부정적인 작용을 한다. 비교적 빠른 구축 속도의 결과는 포장된 파일의 집행에 어느 정도 영향을 미친다.

  • 학습 단계와 작은 항목에서 중성까지의 항목에 있어 eval-source-map은 좋은 옵션이지만 포장된 JS 파일의 실행은 성능과 안전에 위험이 있다.그러나 개발 단계에서 이것은 매우 좋은 옵션이지만 생산 단계에서 반드시 이 옵션을 사용하지 말아야 한다.
    오늘 이렇게 많아남아서 다음에 계속~~

    좋은 웹페이지 즐겨찾기