在windows下安裝Vue及編輯工具Sublime Text3
前言:這是第一次寫博客,不由得有點小緊張,發出去可能也沒有人看,當是激勵一下自己,認真學習,天天向上!這篇筆記已經存了好久了,至今都還沒有更到技術博客裏,今天偷閑,把筆記重新整理一下.如果你也是剛開始學習vue,一定也是查找怎麽安裝,用什麽編輯器之內的問題,那也許我可以幫助到你(親自安裝過程).
安裝Vue可以使用NPM方法.
若沒有npm,那就要安裝一下了.以下是安裝npm操作步驟:
1.安裝Node.js
需要使用npm安裝,若未安裝npm,可操作以下操作:
首先從Node.js官網下載對應平臺的安裝程序，網速慢的童鞋請移步國內鏡像。在windows上安裝時務必選擇全部組件,勾選Add to path
C:\Users\IEUser>node -v
v7.6.0
繼續在命令提示符輸入node，此刻你將進入Node.js的交互環境。在交互環境下，你可以輸入任意JavaScript語句，例如100+200，回車後將得到輸出結果。
備註:要退出Node.js環境，連按兩次Ctrl+C。
2.npm
npm在Node.js安裝時順帶裝好了.我們在命令提示符或者終端輸入npm -v，應該看到類似的輸出：
C:\>npm -v 4.1.2
操作以上步驟,npm安裝好了.(^_^離成功又近了一步)安裝vue
由於npm安裝速度慢,所以使用淘寶鏡像及其命令cnpm.
淘寶 NPM 鏡像是一個完整 npmjs.org 鏡像，你可以用此代替官方版本(只讀)，同步頻率目前為 10分鐘 一次以保證盡量與官方服務同步。
你可以使用淘寶定制的 cnpm (gzip 壓縮支持) 命令行工具代替默認的 npm:
npm install -g cnpm --registry=https://registry.npm.taobao.org
這樣就可以使用 cnpm 命令來安裝模塊了：
cnpm install [name]
npm 版本需要大於 3.0，如果低於此版本需要升級它：
# 查看版本
$ npm -v
2.3.0
#升級
npm cnpm install npm -g
在用 Vue.js 構建大型應用時推薦使用 NPM 安裝：
# 最新穩定版
$ cnpm install vue
命令工具
Vue.Js 提供一個官方命令行工具，可用於快速搭建大型單頁應用。
# 全局安裝 vue-cli
$ cnpm install --global vue-cli
# 創建一個基於 webpack 模板的新項目
$ vue init webpack my-project
# 這裏需要進行一些配置，默認回車即可
This will install Vue 2.x version of the template.
For Vue 1.x use: vue init webpack#1.0 my-project
? Project name my-project ? Project description A Vue.js project
? Author runoob <[email protected]>
? Vue build standalone
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Setup unit tests with Karma + Mocha? Yes
? Setup e2e tests with Nightwatch? Yes
vue-cli · Generated "my-project".
To get started:
cd my-project npm install npm run dev Documentation can be found at https://vuejs-templates.github.io/webpack
進入項目，安裝並運行：
$ cd my-project
$ cnpm install
$ cnpm run dev
DONE Compiled successfully in 4388ms
> Listening at http://localhost:8080
成功執行以上命令後訪問 http://localhost:8080/，輸出結果如下所示：
以上便可以正確安裝Vue了.
Sublime Text3
在官網上下載Sublime Text3,但可能用Sublime Text3打開vue項目文件的話,可能看上去一片白,若Sublime Text3支持Vue高亮顯示的話,就容易編輯了.
讓Sublime Text3支持Vue語法高亮顯示
-
準備語法高亮插件vue-syntax-highlight。https://github.com/vuejs/vue-syntax-highlight
-
下載頁面並下載：
解開壓縮包vue-syntax-highlight-master，其內所有文件備用。
3.將vue-syntax-highlight植入sbulime。進入sublime，選擇菜單項“Preferences->Browse Packages...”。
在打開的文件夾中創建“Vue”文件夾。
在Vue文件夾中，將vue-syntax-highlight-master壓縮包解壓後的所有文件考入。
4.sublime載入vue-syntax-highlight插件按下快捷鍵“ctrl+shift+p”，在打開的packages輸入框中輸入vue，選擇“Set Syntax:Vue Component”進行加載。
加載後重啟sublime，重新打開.vue文件，即能看到語法高亮。
轉載: http://www.runoob.com/vue2/vue-install.html; http://www.runoob.com/nodejs/nodejs-npm.html#taobaonpm https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/00143450141843488beddae2a1044cab5acb5125baf0882000 https://www.cnblogs.com/shuaiandjun/p/7238304.html
在windows下安裝Vue及編輯工具Sublime Text3