nuxt web

Chinese | ENGLISH

nuxt-web

Blog system developed based on nuxtjs

Project introduction:

• Main technologies: nuxtjs 2.0, element-ui 2.0

• Mainly use plug-ins: axios, less, highlight.js, component-cache

• Join QQ group to communicate together: 514450699

Related projects

• Backend management project: vueAdmin

• Backend management address: http://admin.dsiab.com

• Experience account: test / test

Demo address

• Official website: https: //www.dsiab.com

Reasons for choosing nuxt:

• Projects developed by nuxt can be included in search engines and can be used for SEO.

• It’s easy to get started, and the syntax is the same as vue. Some writing methods are different. You only need to create a new file according to the directory, and nuxt will automatically generate the corresponding route.

• Ability to access statistics and advertising codes normally

insufficient

• Some functions of element-ui are not friendly to search engines and SEO, and some components need to be handwritten or modified based on element-ui. For example, the menu part and paging components need to be modified because there is no a link, and a link is more friendly to search engines. This project has rewritten paging components to facilitate SEO. Of course, you can also choose other component libraries or not use them.

Improve loading performance

• Sometimes certain interfaces do not need to be rendered on the server side and can be rendered in the browser. For example, the current homepage list is rendered by server-side calls, and the recommendations and categories in the right menu are rendered by browser, which is the same as normal ajax calls.

• Note that the browser interface needs to be configured with nginx reverse proxy. For details, please refer to: https://www.dsiab.com/post/4421

• This project uses @nuxtjs/component-cache to improve loading performance

How to start the application

 # 下载代码

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

Notice

• By default, the official website interface is called, and the data is synchronized with the official website.

• If you want to use the local interface, modify baseUrl in the /plugins/baseUrl.js file

• If you want to call the interface on the browser side, please modify the proxy in the nuxt.config.js file and forward the corresponding interface to the local service.

Thanks for the appreciation

Creation is not easy, your appreciation and recognition are the driving force for continuous updates!