MAC下vue的安裝

vue-cli安裝

npm install vue-cli -g

vue-cli的版本查看

vue -V

vue-cli的3.0+以后使用的不是vue-cli了，如果用以上的安裝命令安裝的並不是最新版的3.0+的，而如果安裝3.0的話就需要使用新的

npm install @vue/cli -g

如果原來已經安裝了vue-cli的話需要先卸載原來的安裝

npm uninstall vue-cli -g

 

https://www.jianshu.com/p/60d4deda978a

1、vue.min.js文件獲取：
直接下載后將其放入工程中，引用該文件：

鏈接：https://vuejs.org/js/vue.min.js

或者，使用CDN，以下推薦國外比較穩定的兩個 CDN，國內還沒發現哪一家比較好，目前還是建議下載到本地：

• BootCDN（國內） : https://cdn.bootcss.com/vue/2.2.2/vue.min.js

• unpkg：https://unpkg.com/vue/dist/vue.js, 會保持和 npm 發布的最新的版本一致。

• cdnjs : https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js

之后就和正常的js一樣引用，如：

 <script src="https://cdn.bootcss.com/vue/2.4.2/vue.min.js"></script> 

2、下載安裝node

官網：https://nodejs.org/en/download/

下載安裝node

 

查看版本

3、cnpm代替npm
國內直接使用 npm 的官方鏡像是非常慢的，推薦使用淘寶 NPM 鏡像：

sudo npm install -g cnpm --registry=https://registry.npm.taobao.org 

之后就可以使用淘寶定制的 cnpm 命令行工具，來安裝模塊了：

cnpm install [name]

4、安裝Vue.js 的官方命令行工具：

# 全局安裝 vue-cli sudo cnpm install --global vue-cli # 或 cnpm install -g vue-cli 

 

查看版本

5、創建一個新的項目：

# 創建一個基於 webpack 模板的新項目
vue init webpack my-project
# 這里需要進行一些配置，默認回車即可

 

新的項目

報錯，這個錯誤是node_modules帶來的，先忽略：

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! chromedriver@2.40.0 install: node install.js
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the chromedriver@2.40.0 install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above

6、運行項目：

cd my-project
cnpm install # 安裝依賴，安裝在node_modules文件夾
cnpm run dev #運行項目

 

成功

 

瀏覽器運行

參考資料：https://blog.csdn.net/m0_37479246/article/details/78836686
http://www.runoob.com/vue2/vue-install.html
https://blog.csdn.net/gh254172840/article/details/78871573
https://blog.csdn.net/qq_34233232/article/details/78178362

作者：蟲yu
鏈接：https://www.jianshu.com/p/60d4deda978a
來源：簡書
著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。