vue-cli 3.0.x를 webpack4로 업그레이드한 후 새로운 기능은 무엇입니까?

이번에는 webpack4로 업그레이드한 후 vue-cli 3.0.x의 새로운 기능과 webpack4로 업그레이드한 후 vue-cli 3.0.x에 있는 notes에 대해 알려드리겠습니다. 다음은 실제 사례입니다. , 살펴 보겠습니다.

최근 프로젝트가 최적화되고 있습니다. 시간이 나면 vue-cli3.0.x 사용법을 살펴보았습니다. 꽤 기분이 좋습니다. 이전 프로젝트에서는 vue-cli 2를 사용했기 때문에 만들어서 eslint를 강제로 사용하게 하는 것은 우리를 불편하게 합니다. 프로젝트와 관련이 없는 일부 "빌드"와 "구성"은 사람들을 불편하게 만듭니다. . 기업 환경이 많기 때문에 테스트 환경 구성이 필요합니다. ""tt": "node build/tt-build.js""를 추가했습니다. 3.0.x로 어떻게 사용해야 합니까? 이러한 문제를 염두에 두고 3.0.x를 보는 것이 훨씬 더 좋습니다.

1. 공식 홈페이지 안내

기술을 배울 때는 항상 공식 홈페이지에서 정보를 확인하세요. 그곳의 정보가 가장 빨리 업데이트되기 때문이죠.
vue-cli
vue-cli 문서

2. 설치환경

여기서는 npm install -g @vue/cli를 사용하는 것을 권장하며, Yarn global add @vue/cli를 통해 몇 분 안에 다른 설정을 하고 일부 파일을 삭제해야 합니다. rreee Yarn global add @vue/cli를 사용하여 설치하는 경우 디렉터리를 입력해야 합니다. 실행

npm install -g @vue/cli
# or
yarn global add @vue/cli
# 使用vue命令，创建项目(不同于cli2.0的init，create)
vue create my-project

3. 다중 환경 구성

회사에는 개발 환경, 테스트 환경, 공동 디버깅 환경, 온라인 환경이 있기 때문입니다. 수동 구성을 줄이고 한 번에 구성하십시오. 그래서 "package.json"이 2.0.x에 추가되었습니다. "tt": "node build/tt-build.js"" 유형 구성은 많은 파일을 구성할 수 없습니다. vue-cli 3.0.x에서 지원됩니다. ".env" 파일 구성, 여기에 ".env.development", ".env.production" 및 ".env.test" 구성을 추가했습니다. .

1. 기본 대응 및 기본

yarn // 安装项目依赖
cd packages/@vue/cli // 目录
yarn link //添加 link `vue` 执行指命 。
vue create my-project // 创建项目 。

2. 지정된 구성으로 시작

다른 구성을 추가하려면 아래 구성을 지정해야 합니다.

rreee

3.”.env “

구성 파일

Writing 구성 파일 내용 형식은

  development is used by vue-cli-service serve
  production is used by vue-cli-service build
  test is used by vue-cli-service test

입니다. 예: ".env.production" 내용은 다음과 같습니다

"dev-build": "vue-cli-service build --mode development",

4. 환경 구성 조정

 VUE_APP_*

이 기사의 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!

추천 자료:

Vue 구성에서 로컬 json 데이터를 요청하는 방법

pandas+dataframe을 사용하여 행 및 열 선택 및 슬라이싱 작업 구현

셀레늄+쿠키 확인 코드 건너뛰기 로그인 구현 단계 자세한 설명

위 내용은 vue-cli 3.0.x를 webpack4로 업그레이드한 후 새로운 기능은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!