資訊專欄INFORMATION COLUMN
摘要：建議版本關(guān)于全局安裝有許多坑。以及一些其它的全局樣式文件都應(yīng)該在這里引入同時(shí)已經(jīng)使用使用了模塊，關(guān)于相關(guān)的配置，可以在中進(jìn)行配置。其他的基本在實(shí)戰(zhàn)中進(jìn)行改裝。這節(jié)主要是配置使用的修改配置
建議版本：node8.12.0 vue2.5.17 npm6.4.1 webpack4.19.1 nuxt2.0.0
關(guān)于全局安裝webpack有許多坑。詳情可慢慢琢磨（https://blog.csdn.net/Fabulou...，https://www.cnblogs.com/lansan0701/p/7019031.html webpack有關(guān)于sass-loader）
全局安裝npx ：npm install -g npx
然后在使用nuxt-cli創(chuàng)建項(xiàng)目 npx create-nuxt-app profectname
創(chuàng)建完成項(xiàng)目 運(yùn)行npm run dev 報(bào)錯(cuò) index.vue 36行 刪除36行空格就可以了
使用nuxt腳手架創(chuàng)建項(xiàng)目沒(méi)有處理import問(wèn)題，也就是模塊只能使用require。識(shí)別不了
import引入
問(wèn)題在于 npm run dev 使用的是cross-env NODE_ENV=development nodemon
server/index.js --watch server
使用了NODE_ENV node本身是不支持import export這種方法的，這里直接使用node啟動(dòng)程
序，沒(méi)有經(jīng)過(guò)babel處理。所以他是不會(huì)識(shí)別的
解決方法： 使用babel啟動(dòng) 。
nodemon 熱啟動(dòng)，也就是改了文件自動(dòng)刷新。 使用nodemon和babel一起啟動(dòng)， 給dev 后加上-exec babel-node 使用babel和他一起啟動(dòng)。 也就是變成cross-env NODE_ENV=development nodemon server/index.js --
watch server -exec babel-node (注意 不僅僅是開(kāi)發(fā)環(huán)境，線上環(huán)境也應(yīng)該加上保證使
用babel)
這樣重新啟動(dòng)項(xiàng)目 會(huì)發(fā)現(xiàn)還是報(bào)錯(cuò)。是因?yàn)殡m然我們使用了babel node啟動(dòng)，但是我們并
沒(méi)有給babel指定指令集。所以就要?jiǎng)?chuàng)建babel的配置文件。在項(xiàng)目文件內(nèi)（如mt-app/）
創(chuàng)建一個(gè)配置文件 .babelrc 進(jìn)入文件 加上指令集。
{
"presets":["es2015"]
}
這里仍然需要給配置文件 安裝一下 npm install babel-preset-es2015
（注意這里一步?。∪绻陨喜襟E做完報(bào)錯(cuò)）babel-node不是內(nèi)部外部命令。說(shuō)明你沒(méi)有
全局安裝babel，需要全局安裝babel。（安裝教程：
https://www.jianshu.com/p/3e1...）
這樣就會(huì)成功了，說(shuō)明服務(wù)端程序支持es6方式去寫了。
同時(shí)使用element-ui框架的話，應(yīng)該在nuxt.config.js中引入餓了么的css文件，也就是
reset初始化css文件 "element-ui/lib/theme-chalk/reset.css" 就可以了。
以及一些其它的全局css樣式文件都應(yīng)該在這里引入
同時(shí)nuxt.config.js 已經(jīng)使用modules使用了axios模塊，關(guān)于axios相關(guān)的配置，可以在
axios中進(jìn)行配置。（前提安裝時(shí)候選擇axios模塊）
build的配置文件。
如果我們想加一個(gè)緩存，增快他的編譯速度。可以在build中添加 cache:true 增加了編
譯速度。
其他的基本在實(shí)戰(zhàn)中進(jìn)行改裝。
這節(jié)主要是 配置： 1.使用es6的import/export 2.修改build配置
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/100179.html
摘要：是一個(gè)基于構(gòu)建的內(nèi)容管理系統(tǒng)，結(jié)構(gòu)清晰，便于拓展，極其適合前端工程師進(jìn)行二次開(kāi)發(fā)。技術(shù)選型的核心也就是后臺(tái)的內(nèi)容管理，同時(shí)具有前臺(tái)展示需求等功能。支持服務(wù)端渲染，上手也很簡(jiǎn)單，是基于的服務(wù)端渲染程序的不二選擇。 QuillCMS是一個(gè)基于Nodejs、Nuxtjs、MongoDB構(gòu)建的內(nèi)容管理系統(tǒng)，結(jié)構(gòu)清晰，便于拓展，極其適合前端工程師進(jìn)行二次開(kāi)發(fā)。 二話不說(shuō)，先看源碼/演示站 Git...
摘要：根據(jù)官方文檔在文件下面創(chuàng)建兩個(gè)文件，分別是和。在中可以直接使用，并且是默認(rèn)啟用命名空間的。在中觸發(fā)熱更新。使用中間件中間件沒(méi)有給出具體的使用文檔，而是放入了一個(gè)編輯器。對(duì)配置有興趣的可以在官方文檔找到渲染文檔。 Nuxt是解決SEO的比較常用的解決方案，隨著Nuxt也有很多坑，每當(dāng)突破一個(gè)小技術(shù)點(diǎn)的時(shí)候，都有很大的成就感，在這段時(shí)間里著實(shí)讓我痛并快樂(lè)著。在這里根據(jù)個(gè)人學(xué)習(xí)情況，所踩過(guò)的...
摘要：實(shí)際上是指的為簡(jiǎn)化開(kāi)發(fā)而開(kāi)源的第三方庫(kù)。首先安裝依賴然后再配置文件中啟用就完成了使用采坑官網(wǎng)上線后發(fā)現(xiàn)，啟用后不能播放視頻了。把當(dāng)成了失敗請(qǐng)求，導(dǎo)致請(qǐng)求視頻文件失敗。 PWA（Progressive Web App）是前端的大趨勢(shì)，它能極大的加快前端頁(yè)面的加載速度，得到近乎原生 app 的展示效果（其實(shí)難說(shuō)）。PWA 其實(shí)是多種前端技術(shù)的組合，其中最重要的一個(gè)技術(shù)就是 service ...
摘要：前面既然說(shuō)到了會(huì)把文件夾下面的所有文件編譯成路由，那么子路由需要使用文件夾嵌套才行?？蛻舳耸状卧L問(wèn)的頁(yè)面會(huì)在服務(wù)端做輸出，一旦渲染完成之后，則不會(huì)再在服務(wù)端輸出，則會(huì)一直在客戶端進(jìn)行輸出了。 服務(wù)端預(yù)渲染之Nuxt - 使用 現(xiàn)在大多數(shù)開(kāi)發(fā)都是基于Vue或者React開(kāi)發(fā)的，能夠達(dá)到快速開(kāi)發(fā)的效果，也有一些不足的地方,Nuxt能夠在服務(wù)端做出渲染，然后讓搜索引擎在爬取數(shù)據(jù)的時(shí)候能夠讀到...
閱讀 740·2023-04-25 19:43
閱讀 3986·2021-11-30 14:52
閱讀 3816·2021-11-30 14:52
閱讀 3873·2021-11-29 11:00
閱讀 3809·2021-11-29 11:00
閱讀 3907·2021-11-29 11:00
閱讀 3584·2021-11-29 11:00
閱讀 6197·2021-11-29 11:00
