04 kuffy前台搭建

2022-09-23 09:36:08 字數 3375 閱讀 7802

# 在cmd中執行

1.傻瓜式安裝node:

測試:node-v

v16.14.0

2.安裝cnpm:

>: npm install -g cnpm --registry=

# 因為npm比較慢,用**的cnpm來替換npm

3.安裝vue最新腳手架:

>: cnpm install -g @vue/cli

注:如果2、3步報錯,清除快取後重新走2、3步

>: npm cache clean --force

"""

前提:在目標目錄新建luffy資料夾

>: cd 建立的luffy資料夾

1、在terminal:

cd luffycity

npm run serve

2、配置pycharm

├── public/ # 專案共有資源

├── f**icon.ico # 站點圖示

└── index.html # 主頁

├── src/ # 專案主應用,開發時的**儲存

├── assets/ # 前台靜態資源總目錄

├── css/ # 自定義css樣式

└── global.css # 自定義全域性樣式

├── js/ # 自定義js樣式

└── settings.js # 自定義配置檔案

└── img/ # 前台資源

├── components/ # 小組件目錄

├── views/ # 頁面元件目錄

├── main.js # 入口指令碼檔案

├── router

└── index.js # 路由指令碼檔案

store

└── index.js # 倉庫指令碼檔案

├── vue.config.js # 專案配置檔案

└── *.* # 其他配置檔案

"""# 任何元件都有三部分

style :寫css相關

# 清除所有css樣式

/* 宣告全域性樣式和專案的初始化樣式 */

body, h1, h2, h3, h4, h5, h6, p, table, tr, td, ul, li, a, form, input, select, option, textarea

a ul

table

export default
// 配置全域性樣式

import '@/assets/css/global.css'

// 配置全域性自定義設定

import settings from '@/assets/js/settings'

vue.prototype.$settings = settings;

// 在所有需要與後台互動的元件中:this.$settings.base_url + '再拼接具體後台路由'

# 1 建立專案

vue create luffy_front

# 2 使用pycharm開啟,配置可以使用點選啟動

# 4 刪除 helloworld.vue 和about.vue

# 5 修改 router--index.js,刪掉 about的路徑

# 6 配置全域性css--》assets--》css--》global.css

/* 宣告全域性樣式和專案的初始化樣式 */

/*清除掉所有標籤的預設樣式

*/body, h1, h2, h3, h4, h5, h6, p, table, tr, td, ul, li, a, form, input, select, option, textarea

a ul

table

# 7 在main.js中引入

// 引入寫的全域性css global.css

import './assets/css/global.css'

# 8 安裝axios

npm install axios

# 9 在main.js中引入

import axios from "axios";

// 原型,把axios放到vue的原型中

// 以後在vue物件中直接通過 this.$axios 拿到的就是axios

vue.prototype.$axios=axios

# 10 編寫配置檔案 assets---》js---》settings.js

export default

# 11 在main.js中配置

import settings from "./assets/js/settings";

vue.prototype.$settings=settings

# 12 以後在元件中使用

created() )

}

04 前向宣告 巢狀類 區域性類

一 類的前向宣告 有種特殊情況,當兩個類需要相互引用形成乙個 環形 引用時,無法先定義使用。這時候需要用到前向申明,但是前向申明的類不能例項化。下面的三個圖展現了前向宣告的用法和注意的事項 1 class a 即前向宣告了這個a類,此時a類被宣告而沒有被定義 這種時候稱之為前向宣告 在宣告之後,定義...

條款04 確定物件被使用前已被初始化

記住 永遠在使用物件前先將它初始化。1 不要混淆賦值assignment和初始化initialization。abentry abentry const std string name,const std string address,const std list phones 版本1 abentr...

條款04 確定物件在使用前已經被初始化

讀取未初始化的值會造成不明確的行為。例如下面這個建構函式 abentity abentity const std string name,const std string address,const std list phones thename name theaddress address th...