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
后续。。。