安裝Node,建立vue專案,執行及打包

2022-07-19 18:39:10 字數 1295 閱讀 8775

1、安裝node js

2、安裝完成後執行node.js command prompt(node -v檢視安裝版本)

3、安裝npm(由於現在版本的nodejs已經整合npm所以無需安裝,可以用npm -v 檢視版本)

4、註冊cnpm來代替npm

使用命令:npm install cnpm -g --registry=

如果你發現你安裝成功了,使用cnpm卻發現找不到命令,那麼就是你的環境變數有問題,在環境變數裡面的path新增你node的安裝路徑就行,比如";c:\program files\nodejs\node_modules"

5、安裝vue腳手架vue-cli

命令:cnpm install -g vue-cli

安裝成功後可以用 vue -v 檢視vue版本

6、cd到對應的目錄下初始化vue專案

命令:vue init webpack my-project

project name 專案名

project description 專案名描述

author 作者郵箱

use eslint to lint your code? 是否需要eslist語法檢查

setup unit tests with karma + mocha? 是否需要單元測試

setup e2e tests with nightwatch? yes是否需要e2e測試

7、package.json為專案依賴資源,如果要執行這個專案需要使用cnpm install 安裝依賴項(直接在專案資料夾路徑下執行)

8、使用命令cnpm run dev啟動專案,瀏覽器會開啟 http://localhost:8080/#/ 看到以下效果

開發時屬於熱部署狀態,**儲存後瀏覽器會自動重新整理,錯誤提示也非常友好。

9、編譯打包 cnpm run build

會編譯打包到專案dist資料夾下,然後我們就可以部署到伺服器上(注意:如果你直接開啟index.html,可能頁面會是一片空白,這是由於你引用的js路徑有問題)

vue 安裝並建立vue專案

2,npm包管理器,是整合在node中的,所以安裝了node也就有了npm,直接輸入 npm v 命令,顯示npm的版本資訊。3,安裝vue cli,執行下面的命令 npm install g vue cli cnpm i g vue cli 安裝結束之後,可以使用vue v 檢視 vue 的版本 ...

vue安裝及建立專案

安裝 cnpm install vue g cnpm install vue cli g 建立vue專案 vue init my pro 或者 vue init webpack my pro 建立完專案需要修改package.json 增加依賴,執行下面命令安裝依賴 cd my pro cnpm i...

如何建立並執行vue專案

如何執行vue專案 1 安裝node.js npm包 vue cli構建工具 npm install g vue cli cnpm npm的 映象 可直接用npm 2 建立專案 vue init webpack webpack構建工具 firstvue 專案資料夾名稱 直接回車 yes 即可 完成後...