創建vue實例

在已經建立的web項目上配置vue環境

命令窗口切換到目錄下，執行cnpm init配置相應內容，生成package.json文件，

此時package文件dependencies插件依賴的開發環境還沒有，

執行cnpm install vue --sava(也可以cnpm install vue --sava-dev配置devDependencies)，都是一樣的，

之後配置vue-resource(調接口的)，執行cnpm install vue-resource --save

 

 

 

 

cnpm i vue --save  安裝vue

cnpm list  查看有哪些依賴

node  進入node界面

cnpm install -g vue-cli   全局安裝vue腳手架

vue init webpack-simple demo   安裝簡介webpack

vue init webpack  demo  安裝完整webpack

cnpm install  安裝所有所需依賴

cnpm run dev  運行項目

 

vue-cli搭建目錄中：

config/index.js：端口號等相關配置

index.html爲入口頁面；

src/main.js爲入口頁面的js 

src/App.vue爲頁面級vue組件

src/router/index.js組件配置js

src/components：組件目錄

src/assets:資源目錄

static:靜態文件目錄

//////////////////

*組件.vue中<template>整體的<div>模塊</template>

*.vue文件中，用import引用靜態css/js文件

*組件.vue中<style>要在<template>的外面

 

 

 

chrom斷點測試

Ctrl(commond)+p定位到某個js，會看到報錯信息，斷點查看到底哪裏出錯了