머리말
최근 몇 가지 작은 움직임이 있습니다.두 가지 발전해야 할 프로젝트가 있고 프론트 엔드 항목을 선택해야합니다.
환경
현재 제 환경은 아직 vue2라서 이 개발은 여전히 vue2 위주로 되어있습니다. 물론 전환은 어렵지 않습니다. 그냥 여기에서 환경설정을 귀찮게 하지 않습니다. 지겹습니다. 홍채버전 문제를 잊을수가 없네요. 나는 바둑을 했다. 어느 날.
vue-cli 프로젝트 생성
내 로컬 vue 버전은 여전히 2.5x
이므로 프로젝트를 만들 수 없습니다. vue create를 할 수 없거나 init webpack name만 볼 수 있습니다
. 프로젝트 생성에 대해 몇 가지만 말씀드리고 싶습니다. 첫 번째 npm은 정말 느리면 사용하지 않는 것이 좋습니다. cnpm을 먼저 다운로드하는 것이 좋습니다.
npm install -g cnpm --registry=https://registry.npm.taobao.org
그런 다음 프로젝트 생성을 시작하기에 적합한 위치를 찾으십시오.
여기에 있는 단어는 여전히 오래된 규칙입니다. 처음 몇 가지 예를 선택한 후 먼저 라우팅을 선택한 다음 아니오와
다른 아니오 다음에 프로젝트를 입력하는 것이 좋습니다
. 여기에서 라우팅 코드를 생성하는 데 도움이 되지만 수행합니다. 여기. 작은 화장.
개조 하나
프로젝트 구조.
개조 II
개조 3
아이콘 변경
테스트
효과를 보실 수 있습니다.
이 시점에서 기본 프로젝트 변환이 완료됩니다.
그런 다음 요소 UI 구성 요소 라이브러리를 가져옵니다. (사실 이때는 저번에 작성한 프로젝트의 종속성을 직접 가져오도록 선택할 수 있습니다.)
使用 요소
먼저 우리는 다운로드해야합니다
cnpm i element-ui -S
이 경우 실제로 -g를 추가하고 전역적으로 다운로드하도록 선택할 수 있습니다.
그런 다음 구성 요소를 가져옵니다.
/*引入element组件*/
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
로더 설치
이것은 주로 ui 요소를 로드하는 CSS입니다.
cnpm install sass-loader node-sass --save-dev
테스트
좋아, 다음에 테스트하자.
버튼 테스트를 컴포넌트에 도입하십시오.
요약하다
나는 그 과정을 다시 회상한 다음 구성 요소로 갔다.
이번에는 더 많은 시간이 있기 때문에 결국 초보자가 아니므로 더 빨라야합니다.