lang="less"報錯，原因是less-loader版本過高
解決辦法：將less-loader的版本降低
1、在package.js中找到less-loader，將版本號改為 ^5.0.0；
2、然后再執行npm install less-loader@5.0.0 --save。
https://blog.csdn.net/l244112311/article/details/105844036
axios.defaults.withCredentials = true;
- 默認情況下，跨源請求不提供憑據(cookie、HTTP認證及客戶端SSL證明等)。通過將withCredentials屬性設置為true，可以指定某個請求應該發送憑據。
- 后端需要帶cookie過去，而前端沒有設置為true，所以導致cookie傳不過去
- 當配置了 withCredentials = true時，必須在后端增加 response 頭信息Access-Control-Allow-Origin，且必須指定域名，而不能指定為*！！！
https://www.cnblogs.com/hehuiqiong/p/13132226.html - vue不會自動保存后端傳來的cookie
https://blog.csdn.net/qq_39611230/article/details/108090828
Vuex namespaced: true配置
- 使其成為帶命名空間的模塊。保證在變量名一樣的時候，添加一個父級名拼接
https://blog.csdn.net/qq_40410916/article/details/108121892
Uncaught TypeError: routes.forEach is not a function
vue創建項目報錯
Command vue init requires a global addon to be installed.
Please run yarn global add @vue/cli-init
- 解決辦法：先執行以下命令
npm install -g @vue/cli-init
https://blog.csdn.net/weixin_42886893/article/details/107022876
less報錯
* !!vue-style-loader!css-loader?{"sourceMap":true}
!../../node_modules/vue-loader/lib/style-compiler/index? .......
- 原因：缺少相關依賴
- 解決辦法：npm install less less-loader --save-dev
http://www.lxweimin.com/p/72e3af3fa747
vue項目打包后，dist里有文件報錯404
- 修改config/index.js
assetsPublicPath: './' // 將'/'改成'./'
https://blog.csdn.net/miss_liangrm/article/details/98534134
- 如果router里設置了base值，則設置為該目錄
const router = new Router({
base: 'treat',
mode: 'history'
});
assetsPublicPath: '/treat/' // ***
Vue+elementUI build打包后字體圖標丟失問題
解決辦法：
build目錄下utils.js，添加 publicPath: '../../'
if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
fallback: 'vue-style-loader',
publicPath: '../../' // 修改
})
} else {
return ['vue-style-loader'].concat(loaders)
}
https://blog.csdn.net/qq_38543537/article/details/90755830
vue配置dev、test、pro環境，實現分環境打包
https://www.pianshen.com/article/57691807884/
webpack 在index.html里面區分環境變量（process.env.NODE_ENV）
<script>
if ('<%= process.env.NODE_ENV %>' === 'development') {
window.SITE_CONFIG['apiURL'] = '/api'; // prod_api // api請求地址
} else {
window.SITE_CONFIG['apiURL'] = '/prod_api'; //
}
</script>
https://blog.csdn.net/xiaomogg/article/details/102549753
網頁title的logo小圖標
- 圖片需要放在static里引入，本地才會展示
<link rel="shortcut icon" type="image/x-icon" href="./static/img/logo.png" />
PC端網頁基本設置
<title>標題</title>
<meta name="description" content='內容長一點' />
<meta name="keywords" content='內容短一點' />
<link rel="shortcut icon" type="image/x-icon" href="./static/img/logo.png"/>
移動端網頁適配
<meta id="viewport" content="width=device-width, user-scalable=yes,initial-scale=1" name="viewport" />
<script>
var detectBrowser = function(name) {
if (navigator.userAgent.toLowerCase().indexOf(name) > -1) {
return true;
} else {
return false;
}
};
var width = parseInt(window.screen.width);
var scale = width / 640; // 根據設計稿尺寸進行相應修改：640=>?
var userScalable = 'no';
if (detectBrowser("qq/")) userScalable = 'yes';
document.getElementById('viewport').setAttribute(
'content', 'target-densitydpi=device-dpi,width=1445,user-scalable=' + userScalable + ',initial-scale=' + scale); // 這里也別忘了改：640=>?
</script>
https://www.jb51.net/article/110711.htm
npm run build 打包報錯
解決方案：npm 更新到最新版本
npm install npm@latest
https://blog.csdn.net/q709984620/article/details/105699364
axios post請求出現兩次
多了一個看似無效的OPTIONS請求。這里其實是一次"預檢"請求，瀏覽器先詢問服務器，當前網頁所在的域名是否在服務器的許可名單之中，以及可以使用哪些HTTP動詞和頭信息字段。只有得到肯定答復，瀏覽器才會發出正式的XMLHttpRequest請求，否則就報錯。
- 產生跨域的原因是因為，開發前端vue項目時要開端口，后端服務也要開端口，然后端口不同，產生了跨域。又因為content-type為application/json;charset=UTF-8 ，所以就有 options 請求。當項目打包上線后就沒跨域了，options自然就沒了
