整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
當我們完成一個項目開發(fā)的時候，下一步肯定會要把這個項目放到互聯(lián)網上進行發(fā)布，此時我們就得先通過打包命令npm run build來對項目進行打包。
在命令行工具中運行（需進入項目路徑）：
npm run build稍等片刻后如果提示如下信息則表示打包成功：
打包成功后會在當前項目目錄下多出一個dist目錄：
在打包之前一定要將之前開發(fā)過程中使用反向代理的操作給去除掉，一上線代理就失效了。同時需要注意解決數據接口的跨域請求問題。
注意：打包之后得到的這些文件都是經過壓縮處理的，如果需要更改原先JavaScript、css等文件的內容，請在開發(fā)環(huán)境中去修改，然后重新打包生成。
項目上線部署需要有服務器，此處我們以已經購買好的阿里云ECS（CentOS 7.9版本操作系統(tǒng)）為例。
后續(xù)操作會用到不少相對路徑，為了保證大家的操作正確，此處統(tǒng)一先切換當前工作路徑：
cd /usr/local/src
# 該地址是已經存在的，不需要自己創(chuàng)建①如果項目中使用到了mongoDB，則需要先安裝mongoDB
下載地址：https://www.mongodb.com/try/download/community
可以選擇Copy Link隨后去服務器中對應的目錄執(zhí)行命令下載：
wget https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-rhel70-4.4.1.tgz
# 或
curl -O https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-rhel70-4.4.1.tgz也可以直接用今日docs目錄下已經下載好的壓縮包，使用FileZilla進行上傳到服務器的/usr/local/src目錄。
.tgz格式文件是壓縮包文件格式的一種，需要使用其中的內容得先解壓，解壓命令為：
tar -zxvf mongodb-linux-x86_64-rhel70-4.4.1.tgz
# 或
tar -xvf mongodb-linux-x86_64-rhel70-4.4.1.tgz
# -z：表示指定解壓縮所使用的方式，表示使用gz格式進行解壓
# 如果不指定使用什么方式解壓，則tar會自己判斷解壓后會得到mongoDB的解壓目錄：
Linux系統(tǒng)下對于第三方軟件的安裝一般存放在/usr/local下，此處建議將解壓后得到的目錄中的bin目錄進行轉移，轉移的同時需要創(chuàng)建mongoDB的數據文件夾和日志文件夾，命令如下：
mkdir -p /usr/local/mongodb/data
mkdir /usr/local/mongodb/log
cp -r /usr/local/src/mongodb-linux-x86_64-rhel70-4.4.1/bin /usr/local/mongodb/
# 建立mongodb需要使用的日志文件
touch /usr/local/mongodb/log/logfile上述指令執(zhí)行完畢后可以通過ls進行列出檢查，查看是否有以下文檔結構：
ls /usr/local/mongodb/隨后，就可以通過以下命令去啟動mongoDB了：
需要注意，此種方式的mongoDB為綠色軟件，默認不會開機自動啟動，不再需要使用的時候直接刪除/usr/local/mongodb目錄即可卸載軟件。
/usr/local/mongodb/bin/mongod --dbpath=/usr/local/mongodb/data --logpath=/usr/local/mongodb/log/logfile --bind_ip=127.0.0.1 --fork
# --dbpath：指定數據庫文件夾位置
# --logpath：指定日志文件位置
# --bind_ip：綁定監(jiān)聽的網卡ip地址
# --fork：以后臺服務的形式運行注意：logpath配置項的值一定是一個文件（可以不存在），不能是文件夾。
至此，mongoDB已經可以使用了，可以通過運行mongoDB連接工具進行測試，如果有以下輸出則一切正常：
此時可以在其中創(chuàng)建好maizuo數據庫，以及往庫中寫入users表中的數據了。
②安裝nodejs
文檔地址：https://github.com/nodesource/distributions/blob/master/README.md
復制好對應的指令后在終端中去執(zhí)行（這個命令會在我們服務器上安裝一個nodejs的鏡像源以告訴包管理工具去哪里下載nodejs）：
curl -sL https://rpm.nodesource.com/setup_14.x | bash -隨后運行以下命令安裝nodejs：
sudo yum install -y nodejs使用sudo開頭的命令可能會提示讓輸入密碼，如果有則輸入當前用戶的密碼即可。
安裝好nodejs后，可以通過命令測試是否安裝成功nodejs：
node -v最后，可以繼續(xù)安裝一些可選的全局包以方便后面使用：
# 安裝nrm，并切換npm鏡像源為淘寶
npm i -g nrm
nrm use taobao
# 安裝nodemon
npm i -g nodemon
# 安裝pm2（讓node在后端運行的工具，這樣可以在配置完畢之后關閉終端窗口）
npm i -g pm2到此，nodejs環(huán)境安裝完畢！
③安裝nginx
Nginx是一款輕量級服務器/反向代理服務器及電子郵件（IMAP/POP3）代理服務器，其特點是占有內存少，并發(fā)能力強，事實上nginx的并發(fā)能力在同類型的網頁服務器中表現較好，中國大陸使用nginx網站用戶有：百度、京東、新浪、網易、騰訊、淘寶等。
軟件官網：https://nginx.org/
傻瓜式包管理工具安裝方式說明參考地址：https://nginx.org/en/linux_packages.html#RHEL-CentOS
按照上述提示，在服務器上指定的位置/etc/yum.repos.d/nginx.repo新建一個文件，文件內容如下：
[nginx-stable]
name=nginx stable repo
baseurl=http://nginx.org/packages/centos/$releasever/$basearch/
gpgcheck=1
enabled=1
gpgkey=https://nginx.org/keys/nginx_signing.key
module_hotfixes=true
[nginx-mainline]
name=nginx mainline repo
baseurl=http://nginx.org/packages/mainline/centos/$releasever/$basearch/
gpgcheck=1
enabled=0
gpgkey=https://nginx.org/keys/nginx_signing.key
module_hotfixes=true對于文件的創(chuàng)建和修改，可以考慮咋windows上進行，寫完畢之后再通過文件傳輸工具，將文件上傳到指定的位置即可。
隨后運行nginx的安裝命令：
sudo yum install -y nginx在nginx完成安裝后，可以通過以下幾個命令來管理nginx服務：
# 啟動nginx
systemctl start nginx
# 停止nginx
systemctl stop nginx
# 重啟nginx
systemctl restart nginx
# 設置nginx開機自啟動
systemctl enable nginx
# 設置nginx開機不自啟動
systemctl disable nginx接下來啟動nginx：
systemctl start nginx請注意，后續(xù)每次修改了nginx的配置文件都需要對nginx服務進行重啟，否則新的配置不會生效。
nginx相關的目錄位置：
④域名解析（如果有域名的話）
如果是大陸服務器使用，則域名一定要通過了ICP備案才可以
以阿里云為例，先進入域名控制臺，在需要使用的域名后面點擊解析按鈕進入解析頁面，隨后點擊添加記錄按鈕并按照自身需求填寫解析信息：
設置完成后一般1分鐘內即可生效，可以在本機windows上通過ping命令進行測試：
# 以剛才設置的域名為例（請?zhí)鎿Q成自己的域名）
ping sh2008.lynnn.cn⑤項目代碼部署
a. 將打包好的vue代碼上傳到Nginx默認的站點下，目錄地址為/usr/share/nginx/html
b. 啟動node服務端為項目提供數據訪問服務
如果出現無法訪問的情況，請注意防火墻與云安全組的設置。
上傳node服務端的代碼到遠程服務器，位置可以隨意（因為代碼是node運行的，不是nginx）：
接下來進入node代碼的目錄/usr/local/src/http，運行安裝所需模塊的指令：
npm install此時即便運行了node服務器，也會出現無法訪問的情況，需進入阿里云的控制臺添加允許3000端口通過。
最后，讓node在后臺執(zhí)行http.js文件（根據需要換成自己的文件名），此處需要用到前面安裝的pm2工具：
# 先進入項目目錄
pm2 start http.js
## 重啟
pm2 restart http.js
## 停止
pm2 stop http.js如果成功，則會看到如下效果：
c. 解決nginx下，路由模式history失效的問題
方案1：不使用history模式的路由
不使用istory模式，則得用hash模式，該模式下地址欄會有#
方案2：配置nginx，讓nginx支持history模式的路由
try_files $uri $uri/ /index.html;將上述的代碼放到/etc/nginx/conf.d/default.conf中
location / {
root /usr/share/nginx/html;
index index.html index.htm;
# 以下是新增的一行
try_files $uri $uri/ /index.html;
}隨后重啟nginx：
systemctl restart nginx重啟之后新的配置將會生效，項目到這里也就可以通過域名或者ip地址進行訪問了。
命令行打開 WebStorm 中的任意文件或文件夾，可選擇指定打開后插入符號的位置。
WebStorm官方最新版免費下載試用，歷史版本下載，在線文檔和幫助文件下載-慧都網
Windows
可以在bin下的安裝目錄中找到運行 WebStorm 的可執(zhí)行文件。要將此可執(zhí)行文件用作命令行啟動器，請按照命令行界面中的說明將其添加到您的PATH系統(tǒng)中。
句法
webstorm64.exe [--line <number>] [--column <number>] <path ...>例子
打開一個項目：
webstorm64.exe C:\MyProject打開第 42 行的特定文件：
webstorm64.exe --line 42 C:\MyProject\scripts\numbers.jsmacOS
句法
webstorm --line <number> <path>例子
打開一個項目：
webstorm ~/MyProject打開第 42 行的特定文件：
webstorm --line 42 ~/MyProject/scripts/numbers.jsLinux
可以在bin下的安裝目錄中找到運行 WebStorm 的腳本。要將此腳本用作命令行啟動器，請按照命令行界面中的說明將其添加到您的PATH系統(tǒng)中。
句法
webstorm.sh --line <number> <path>例子
打開一個項目：
webstorm.sh ~/MyProject打開第 42 行的特定文件：
webstorm.sh --line 42 ~/MyProject/scripts/numbers.js當指定文件的路徑時，前端開發(fā)工具WebStorm 會以LightEdit 模式打開它，除非它屬于已經打開的項目或有特殊邏輯自動打開或創(chuàng)建項目（例如，在 Maven 或 Gradle 文件的情況下） 。 如果指定包含現有項目的目錄，WebStorm 將打開此項目。如果打開一個不屬于項目的目錄，WebStorm 會將.idea目錄添加到其中，使其成為一個項目。
以上就是有關在WebStorm從命令行打開文件的教程，更多關于WebStorm購買信息可進入慧都官網查看。
WebStorm已更新至V2022.1，歡迎下載WebStorm最新版本試用。
WebStorm官方最新版免費下載試用，歷史版本下載，在線文檔和幫助文件下載-慧都網
WebStorm是一個針對JavaScript和相關技術的集成開發(fā)環(huán)境。像其他JetBrains IDE一樣，它使你的開發(fā)體驗更加愉快，使日常工作自動化，并幫助你輕松處理復雜的任務。
今天我們一起來了解下HTML，
首先HTmL包含三層結構，分別是結構層，表現層，行為層。
結構層：html=> 網頁上有什么，比如說文字啊、按鈕啊、圖片啊等等。
表現層：css=> 顯示成什么樣子，比如說文字的大小啊，位置啊，顏色啊等等。
行為層：JavaScript=> 具體怎么操作，比如說點擊按鈕讓圖片放大縮小等等。
===============================
在了解了html的三層結構之后，我們來學習如何寫html。html不是編程語言，它是一套標簽。最簡單的html文本是下圖1這個樣子。我們可以在電腦桌面上新建一個記事本文件，然后把后綴名改一下（.txt=>.html），把這段標簽代碼粘貼到html文件里，這樣一個空白的網頁就做成了。如果需要在網頁上添加內容，我們只需要在第10行的位置添加各種各樣的標簽即可。比如我在圖二添加了一個按鈕標簽和一段文字標簽，雙擊html文件，頁面上就從左到右，從上到下顯示對應的內容。是不是很簡單。我們日常瀏覽的網頁都是這樣一個標簽一個標簽畫上去的。
我給大家總結了一張圖，基本上覆蓋了工作中常用的知識點。同時分享幾個小技巧。
1.最簡單的網頁寫成什么樣子，也就是html模板不需要記憶，下圖也說了，去百度下載一個VSCode軟件（類似于記事本，是現在主流的前端代碼編輯器），用它打開我們的html文件，輸入英文嘆號回車就自動生成了，學編程不要死記硬背。
2.控件的標簽不需要記憶，直接百度html XXX標簽，例如：百度搜“html按鈕標簽”，他就會告訴我們是<button>，用的時間長了自然就記住了。是不是省力。
3.標簽的屬性很重要，可以不去記他的寫法，因為寫可以百度，重要的是你需要記住標簽有什么屬性，下圖的屬性記住足矣。為什么要記呢，因為工作中，有的時候會遇到這樣一種情況，明明設置一個屬性可以完成的功能，我們不知道，花費了大力氣用css和js去實現，結果還存在著特定場合的bug，讓人很無奈。
4.對于html還有兩個標簽<canvas>和<svg>，他們是用來繪圖的，做特殊效果的。我們可以先跳過，等框架啥的都學完了，有興趣，學習一下。
5.給大家推薦一個小白學習html的網站，w3cschool，圖里不明白的可以去上邊學學練練。
6.如果覺得一個人學習前端有難度，我建了一個小白前端學習交流群，可以私聊我，大家在群里多多交流，我會經常給大家答疑，組織大家練習，一起做小項目。有方向，少走彎路。
*請認真填寫需求信息，我們會在24小時內與您取得聯(lián)系。
