Vue 框架 10 搭建腳手架 CLI

2022-07-04 00:54:09 字數 1934 閱讀 4402

2.開啟終端或者 cmd 使用下面兩個命令進行測試:

要求:node 版本 >6.9.0

node -v
要求:npm 版本 >=3.10.0

npm -v
vue cli 官方文件:

1.全域性安裝 vue-cli,使用:

npm install --global vue-cli
然後它提示有乙個搬家了,也可以根據提示安裝了,我也不知什麼用處,多一條命令而已:

測試有沒有安裝成功:

vue --version
2.建立乙個基於 webpack 模板的新專案【注意】:先在終端 cmd 進入想要存放專案的路徑

下面輸入命令,建立示例專案 first_pro (專案名不能有大寫)

vue init webpack first_pro
然後會提示專案的額一些配置資訊,想要使用()中的預設的資訊,就按回車就可以

【注意】不要著急回車,不然會預設裝一大堆東西,暫時不需要(我第一次裝的時候就全回車,然後共有 2500 個檔案,小聲。。)

目前的話,按我的選擇選就可以:

3.然後特會提示我們執行:

cd first_pro

npm run dev //開啟開發環境,怎麼關閉呢?把 cmd 視窗關閉,它就關閉了

如果你沒有執行 npm 還會提示 npm install

4.然後完成,它就會提示我們可以訪問:

有人有疑惑了,那我豈不是沒開啟一次環境,開啟 cmd 再 cd 進入專案路徑,再使用 npm run dev 太麻煩了

【巧了】:樓主了解一點批處理,教你怎麼快捷啟動

1.在桌面新建記事本,命名為 npm run dev.txt,寫入下面內容:

【注意】:路徑改成自己的

@echo off

@mode con lines=18 cols=55

d:cd d:\space\webpackpro\first_pro

npm run dev

2.點【檔案】>【另存為】>【所有檔案】>該字尾名為【.bat】>【修改編碼 utf8】>【儲存】

3.雙擊就可以開啟啦!

vue之cli(腳手架)的基本搭建

cli 腳手架,民間約定俗成的名字 官網並沒有個名字 1.作用 2.版本 cli2 cli3 3.安裝調節工具優先順序為 npm配置yarn的國內 映象 yarn config set registry global yarn config set disturl global 按順序在控制台執行一...

vue腳手架,搭建vue專案框架

1.安裝node.js 2.基於node.js,利用 npm映象安裝相關依賴 在cmd裡直接輸入 npm install g cnpm registry 回車,等待安裝.3.安裝全域性vue cli腳手架,用於幫助搭建所需的模板框架 在cmd裡 1 輸入 cnpm install g vue cli...

搭建Vue腳手架

從vue官網安利了一波安裝腳手架的主要 全域性安裝 vue cli npm install global vue cli 建立乙個基於 webpack 模板的新專案 vue init webpack my project 安裝依賴,走你 cd my project npm install npm r...