1. 程式人生 > >前後端分離-前端搭建(Vue)(2)

前後端分離-前端搭建(Vue)(2)

先安裝node.js以及npm

現在基本的node.js都包含有npm,下載安裝後,

可以在cmd命令裡輸入 

node -v    和npm -v 分別檢視安裝的版本 

兩個都顯示了版本就是安裝ok

 

這次我們使用JetBrains WebStorm 這個和 idea是同一個公司開發的軟體來寫前端

這次我們直接在軟體上去建立Vue專案 , 不需要我們自己去手動輸入命令了 ,

開啟軟體 , 新建一個Vue

然後輸入你的專案名

一路下去的配置中 , 有三個要選取no , 其他的預設即可

需要自己選no的如下:

 

下面這個直接預設即可 

 

接下來就只要等軟體自動去下載好了 , 等右下角這個下載好

 

接下來我們去弄一個專案啟動的配置 ,不然每次都要去輸入命令

 

記得點選ok ,儲存

然後返回 , 就會看到右上角

點選這個綠色的三角形執行看看

控制檯出現如下頁面,即是Vue配置成功了

然後根據這個連結  http://localhost:8083去瀏覽器訪問 ,能看到如下頁面就成 :

相關推薦

前後分離-前端搭建vue

前端使用vue,那麼怎麼搭建vue呢   先安裝nodejs以及npm 現在基本的nodejs都包含有npm,下載

前後分離-前端搭建Vue2

先安裝node.js以及npm 現在基本的node.js都包含有npm,下載安裝後, 可以在cmd命令裡輸入  n

前後分離-前端搭建Vue3加入Element和axios

繼續上篇部落格的Vue剛剛搭建完 , https://my.oschina.net/u/4116654/blog/306

Vue+Django2.0 restframework打造前後分離的生鮮電商專案1

1.開發環境配置 Windows7 64位旗艦版 python3.6 node.js mysql navicat pycharm webstorm或vscode 2.專案初始化   新版的pycharm很貼心的讓每一個新的專案,都自動會在一個虛擬環境中,放心的新建專案就可以了,不用考慮虛擬環境的事兒了 1.新

springBoot + vue前後分離專案如何部署到伺服器嘗試各種方法終究是路徑問題導致無法正常登入

第一步:命令列npm run build將前端打包成靜態檔案(一般會在dist目錄下生成static資料夾以及index.html檔案) 上圖為:config目錄index.js配置的build以及dev命令,如果你沒找到static資料夾及index.html,到這裡

Docker環境下的前後分離專案部署與運維搭建MySQL叢集

單節點資料庫的弊病 大型網際網路程式使用者群體龐大,所以架構必須要特殊設計 單節點的資料庫無法滿足效能上的要求 單節點的資料庫沒有冗餘設計,無法滿足高可用 單節點MySQL的效能瓶領頸 2016年春節微信紅包巨大業務量,資料庫承受巨大負載 常見MySQL叢集方案   mysql 叢集

前後分離業務邏輯常用封裝函式

1.陣列去空: function clear_arr_trim(array) {  for(var i = 0 ;i<array.length;i++){   if(array[i] == "" ||  (array[i] == null)   || typeo

淺談前後分離中的跨資源共享CORS

簡介 當下無論大廠小廠的前後端開發模式都是前後端分離。以前遇到通過jsonp解決跨域的方式也漸漸的淡出的工程中(不瞭解jsonp的可以看JSONP跨域請求+簡答實現百度搜索)。當前端請求一個介面的時候就會引起跨域,但是當下的前端構建工具都有相應的解決方案,比如webpack中web-dev-server這個

vue前後分離專案搭建

一, vue開發環境搭建 1, 開發工具 WebStorm或Visual Studio Code 2, 下載安裝nodejs ##  後端開發環境 Eclipse + JDK + Tomcat 等不再贅述   二, vue測試專案搭建 1, 新建資料夾

前後分離專案解決跨域問題方式解決

新建CorsFilter類實現Filter介面,程式碼如下: package com.rl.config; import org.springframework.stereotype.Component; import javax.servlet.*; import javax.servle

Docker環境下的前後分離專案部署與運維Redis快取記憶體

Redis快取記憶體 利用記憶體儲存資料,讀寫速度遠超硬碟;可以減少I/O操作,降低I/O壓力。 發紅包、搶紅包的資料可以存在快取記憶體中,加快處理速度,不需要經過資料庫 淘寶首頁一些優惠活動商品等熱資料可以存在快取記憶體中,而基於大資料的推薦產品從資料庫中讀取 Redis介紹

Docker環境下的前後分離專案部署與運維十一Docker Swarm技術

Docker Swarm技術 docker swarm技術(之前的docker叢集都是在 一個虛擬主機上的,但是如果這個主機掛掉了over了,docker技術就是多個虛擬主機形成一個叢集) Swarm是Docker的一個編排工具,參考官網:https://docs.docker.com/engine/

SpringBootSecurity學習17前後分離版之 OAuth2.0 資料庫JDBC儲存客戶

自動批准授權碼 前面我們授權的流程中,第一步獲取授權碼的時候,都會經歷一個授權是否同意頁面: 這個流程就像第三方登入成功後,提問是否允許獲取暱稱和頭像資訊的頁面一樣,這個過程其實是可以自動同意的,需要在客戶端配置中,增加一個自動批准: 這樣我們申請授權碼直接就可以得到: 在流程需要自動完成的時候,

前後分離實踐:基於vue實現網站前臺的權限管理

Vue.js Javascript做為當下的熱門語言,用途很廣泛,從前端到後端處處可見其存在,該技術如今在我們項目內部也大量使用來開發諸如CMS系統以及其他其他一些數據分析系統的前端頁面,為此個人非常感興趣並將其作為帽子卡的擴展內容來進行課余學習。 Javascript框架鱗次櫛比,但基本原理大致相

前後分離的專案中用vue寫電商的搜尋功能和分頁

1,在mock.js中模擬資料 //搜尋商品初始化資料 Mock.mock("/search-service/goods", "get", { "count": "@integer(100,200)", "data|5-15": [{ "id|+1": 1

Yii2.0 前後分離 前端ajax呼叫跨域的問題

Yii2.0有自己的一套防止跨域呼叫的機制,網上一搜一大把的解決方式,無非就是: use yii\filters\Cors; public function behaviors() { return ArrayHelper::merge([ [

從壹開始前後分離【 .NETCore2.1 +Vue 2 +AOP+DI】框架之一 || 前言

緣起     作為一個.Net攻城獅已經4年有餘了,一直不溫不火,正好近來專案不是很忙,閒得無聊,搞一搞新技術,一方面是打發無聊的時間,一方面也是督促自己該學習辣!身邊的大神都轉行的轉行,加薪的加薪,本人比較懶,只想搞技術 [哭笑] ,也是懷著小小的夢想,做一個系列文章可以和大家一起進步,討論,希望總閱讀數

SpringBoot使用SpringSecurity搭建基於非對稱加密的JWT及前後分離搭建

安全問題是一個比較複雜的問題,之前使用過Shiro這個安全框架,確實挺簡單的,後來使用SpringSecurity,SpringSecurity更細粒度可控,現在做專案基本都使用前後端分離的,很少再使用Thymeleaf這類模板引擎,而基於前後端分離的許可權問題

1.vue專案之前後分離vue前端專案啟動報錯出現問題的解決

1.首先安裝node.js環境,安裝完成之後,可在控制面板中,進行驗證,如下圖所示: 因為我自己已經裝了,所以就不需要去擔心這個問題了: "D:\IDEA_JAVA\IntelliJ IDEA 2018.2.4\bin\runnerw.exe" D:\node\node.exe D:\

dotnetcore+vue+elementUI 前後分離前端

                        &n