nuxt web

중국어 |

nuxt-웹

nuxtjs를 기반으로 개발된 블로그 시스템

프로젝트 소개:

• 주요 기술: nuxtjs 2.0, element-ui 2.0

• 주로 플러그인을 사용합니다: axios, less,highlight.js, component-cache

• QQ 그룹에 가입하여 함께 소통하세요: 514450699

관련 프로젝트

• 백엔드 관리 프로젝트: vueAdmin

• 백엔드 관리 주소: http://admin.dsiab.com

• 체험 계정: 테스트/테스트

데모 주소

• 공식 홈페이지: https: //www.dsiab.com

nuxt를 선택하는 이유:

• nuxt에서 개발한 프로젝트는 검색 엔진에 포함될 수 있으며 SEO에 사용될 수 있습니다.

• 시작하기 쉽고 구문은 vue와 동일합니다. 일부 작성 방법은 디렉토리에 따라 새 파일을 생성하기만 하면 nuxt가 자동으로 해당 경로를 생성합니다.

• 통계 및 광고 코드에 정상적으로 접근하는 기능

불충분하다

• element-ui의 일부 기능은 검색엔진과 SEO에 친숙하지 않으며 일부 구성요소는 element-ui를 기반으로 직접 작성하거나 수정해야 합니다. 예를 들어 링크가 없고, 링크가 검색 엔진에 더 친숙하기 때문에 메뉴 부분과 페이징 구성 요소를 수정해야 합니다. 이 프로젝트는 SEO를 용이하게 하기 위해 페이징 구성 요소를 다시 작성했습니다. 물론 다른 구성 요소 라이브러리를 선택하거나 사용하지 않을 수도 있습니다.

로딩 성능 향상

• 때로는 특정 인터페이스가 서버측에서 렌더링될 필요가 없고 브라우저에서 렌더링될 수 있습니다. 예를 들어, 현재 홈페이지 목록은 서버 측 호출로 렌더링되고, 오른쪽 메뉴의 추천 및 카테고리는 브라우저로 렌더링되는데, 이는 일반 Ajax 호출과 동일합니다.

• 브라우저 인터페이스는 nginx 역방향 프록시로 구성되어야 합니다. 자세한 내용은 https://www.dsiab.com/post/4421을 참조하세요.

• 이 프로젝트는 @nuxtjs/comComponent-cache를 사용하여 로딩 성능을 향상시킵니다.

응용 프로그램을 시작하는 방법

 # 下载代码

github: git clone https://gitee.com/wilkwo/nuxt-web.git

或者

gitee: git clone https://github.com/esplori/nuxt-web.git

# 安装依赖
$ npm install
# 本地启动在 localhost:3000
$ npm run dev
# 部署到服务器，先build，再执行start启动
$ npm run build
$ npm run start
# 生成静态项目
$ npm run generate

알아채다

• 기본적으로 공식 웹사이트 인터페이스가 호출되며 데이터는 공식 웹사이트와 동기화됩니다.

• 로컬 인터페이스를 사용하려면 /plugins/baseUrl.js 파일에서 baseUrl을 수정하세요.

• 브라우저 측에서 인터페이스를 호출하려면 nuxt.config.js 파일에서 프록시를 수정하고 해당 인터페이스를 로컬 서비스로 전달하십시오.

감사드립니다

창작은 쉽지 않습니다. 여러분의 감사와 인정은 지속적인 업데이트의 원동력입니다!