Nuxt project to build

First, the project directory structure:

1, the direct use of scaffolding official offer good tools for building: npx create-nuxt-app <project name>

Directory will be the case (specific directories are what put, see the official documentation for details):

 

2 way, hand slowly, see the official document: https://zh.nuxtjs.org/guide/installation#%E4%BB%8E%E5%A4%B4%E5%BC%80%E5%A7% 8B% E6% 96% B0% E5% BB% BA% E9% A1% B9% E7% 9B% AE

 

Second, add sass stylesheet for the project:

Step 1: Command: npm install --save-dev node-sass sass-loader

Step 2: introducing global style sheet you need to add in the configuration file nuxt.config.js root directory, such as:

Note: If you need to use in .vue file, you need to add lang = "scss" as in the style tag:

 

Third, the need to use when initiating a request axios, if you do not have any relevant dependencies installed, then:

Mode 1: command: npm install --save-dev axios 

Then direct reference at the time which pages need to import axios from 'axios'

Option 2: command: npm install --save-dev @ nuxtjs / axios

(1), configured globally, adding module '@ nuxtjs / axios' as nuxt.config.js in:

(2), such as using a simple (refer to site specifically: https://zh.nuxtjs.org/guide/async-data ):

Note:? If you want to require a unified set of API interface requests in one place, needs to be configured by registering interceptors and changing global, then you can do:

1, you need to add a file axios.js in the plugins directory, such as:

2、引用使用,在nuxt.config.js中的plugins添加 '@/plugins/axios.js',如:

3、想要生效看到效果是吧?请重新启动服务,命令:npm run dev

 

后续。。。

 

Guess you like

Origin www.cnblogs.com/waitingbar/p/11272059.html