在創(chuàng)建完一個(gè)Nuxt.js項(xiàng)目后，需要對(duì)它進(jìn)行一些常用的常見的配置，以便于后續(xù)開發(fā)。
關(guān)于創(chuàng)建nuxt.js和初始，請(qǐng)點(diǎn)擊 >> http://m.itdecent.cn/p/20caf50d86bf

將css設(shè)為外聯(lián)方式引入

在 nuxt.config.js 文件中的 build 中加入以下代碼：

build: {
    // css文件外部引入
    extractCSS: true,
}

設(shè)置前：
css在html中嵌套，影響html結(jié)構(gòu)

設(shè)置前.png

設(shè)置后：
css為外聯(lián)樣式引入， 結(jié)構(gòu)美觀 可讀

設(shè)置后.png

配置全局公共CSS

1. 在~/assets/下創(chuàng)建 res.css
2. 將此css路徑添加至nuxt.cofig.js中，并重啟項(xiàng)目

  /*
  ** Global CSS
  */
css: [
    '~/assets/css/res.css',
],

此時(shí)寫在res.css中的樣式將全局生效。

指定某頁面使用自定義模板

1. 在~/layout/ 下創(chuàng)建 myLayout.vue文件 作為我們的指定模板；
2. 在~/page 下的指定頁加入如下代碼，即可。

 <script>
       export default {
           layout: 'myLayout'
       }
   </script>

指定IP和端口訪問

在~/package.json中添加如下代碼：

"config": {
    "nuxt": {
        "host": "0.0.0.0",
        "port": "9000"
    }
}

此時(shí)重新啟動(dòng)項(xiàng)目，將以我們當(dāng)前的IP:9000啟動(dòng)；且同局域網(wǎng)下可共享

暫時(shí)更新這幾個(gè)， 后續(xù)遇到再添加。

初始Nuxt.js先更到這里。
如有疑問請(qǐng)留言；或聯(lián)系郵箱：manbanzhen@qq.com
歡迎訪問：http://www.manbanzhen.top 、http://www.ofus.ink
轉(zhuǎn)載請(qǐng)注明出處。