❶ 使用vue-cli（vue腳手架）快速搭建項目
下面整個過程是基於已經安裝node.js和cnpm的基礎上，node.js如何安裝就不在這里詳說了。如何全局化安裝cnpm，這里簡單提一下：(淘寶鏡像命令)
其實對於安裝vue-cli，使用npm命令和cnpm命令都是可以的，個人覺得使用npm安裝的比較慢，而且很可能會因為網路問題而出錯，所以還是覺得使用cnpm穩一點。
（1）全局安裝 vue-cli ，在命令提示窗口執行：
（2）安裝vue-cli成功後，通過cd命令進入你想放置項目的文件夾，在命令提示窗口執行創建vue-cli工程項目的命令：
通過vue-cli搭建一個vue項目，會自動生成一系列文件，而這些文件具體是怎樣的結構、文件對應起什麼作用，可以看看下面的解釋：
❷ vue 腳手架簡單安裝流程
能夠顯示版本號，說明環境已經安裝好了。
注意：該命令需要在聯網狀態下執行才能成功。
這樣一個簡單的 vue 項目就建立完成。
項目文件結構如下圖：
按照提示，打開瀏覽器輸入地址： http://localhost:8080
最終結果如下：
到此，vue 腳手架搭建完畢，創建的一個測試項目也正常運行。
❸ 創建Vue項目之前需要做哪些准備工作Vue項目如何創建指令是什麼並對指令解
使用Vue，當然要先去學習它的使用方法了，請參考官方文檔Vue
創建Vue項目，可以用官方的腳手架，請參考官方文檔vue-cli
指令就是在HTML標簽上以v-開頭的屬性，比如：v-for, v-if等以及自定義指令。Vue會根據指令去執行相應的操作，自定義指令就執行自定義的操作。詳細請參考官文檔。
❹ vue 腳手架安裝完後為什麼代碼是白色的
什麼叫代碼是白色的，
vue-cli 腳手架，只是一個快速搭建項目的框架
代碼是白色你是說編輯器中代碼的顏色吧
那個是你自己的編輯器設置的，與腳手架無關
❺ 求救：vue腳手架用界面化vue ui創建項目時出現報錯Cannot set property 'context' of null怎麼解決啊
重新新建項目，不要用npm，用yarn試下
❻ vue使用腳手架開發的，如何把腳手架還原出來
只有build代碼沒有源碼想做二次開發？你想多了，打包後的代碼就不是給人看的，如果有sourcemap還有可能（聲明：我不確定sourcemap是否能還原出源文件），否則的話洗洗睡吧，去二次開發build代碼還不如重構一遍來得有效率
❼ vue腳手架工具搭建的項目和script標簽引入vue.js的項目，這兩者什麼區別
我也是初學，不知道理解的對不對，如有錯誤請輕噴。腳手架工具搭建的項目應該是把Vue作為一個模塊（如CommonJS規范的模塊）對待，在源碼中引入vue模塊，最終需要用構建工具（如webpack）載入模塊，編寫代碼需要require('vue')。而直接用<script>標簽引入相當於直接把vue.js里的代碼引入到自己的代碼中，裡面直接有一個Vue全局變數，不需要構建工具就能直接使用了。
❽ vue2.0用腳手架搭建的官方例子怎麼用webpack打包 如何配置
前言 vue2 然後通過以下命令安裝 webpack cnpm install webpack -g 註：下面 orange 默認給出 npm 的安裝方案，安裝失敗請自行轉為 cnpm 安裝 在需要創建工程的位置運行 vue init webpack-simple 工程名字<工程名字不能用中文> 或者創建 vue1.0 的項目，只需將命令換成 vue init webpack-simple#1.0 這里我們基於 2.x 開發的，直接使用第一種方法創建工程即可，下圖是創建工程時的截圖，需要你添加 Project name，Project description，Author. 圖中已經給出下一步應該操作的步驟，我們按照步驟一步一步執行，這里 orange 不給大家一步一步列出。 注意：這里一定要使用 npm install 安裝官方庫，而不要使用淘寶鏡像，會導致部分依賴丟失。 安裝完成後，目錄如下圖。 然後我們運行我們的項目後瀏覽器會自動彈出，並展示以下頁面 這里注意觀察，默認給我們八個鏈接，可以根據這幾個鏈接獲得我們想要的學習資源，上面是必要的的鏈接（官方文檔以及關注 vue 動態），下面是 vue 的生態系統，大家親切的叫它們為全家桶。 二、Vue 全家桶 我們接下來介紹全家桶的安裝（使用詳情大家可以去初始頁面的鏈接查看） 一句命令搞定全家桶 npm install vue-router vue-resource vuex --save package.json 已經加入了我們的全家桶，node_moles 目錄下也有對應的依賴包，注意這里現在還不能用擴展之後的方法，因為我們沒引入到項目中來。 src/main.js 修改如下 import Vue from 'vue' import VueResource from 'vue-resource' import VueRouter from 'vue-router' import Vuex from 'vuex' import App from './App.vue' Vue.use(VueResource) Vue.use(VueRouter) Vue.use(Vuex) new Vue({ el: '#app', render: h => h(App) }) 這時我們的項目就能運行對應的擴展方法了 三、集成 Sass 作為移動端的開發怎麼能缺少 css 預編譯語言。sass 安裝需要幾個依賴。 我們乾脆在 package.json 把版本寫死，然後通過 npm install 安裝 在 "devDependencies": {} 中添加下面幾個依賴 "node-sass": "^3.8.0", "sass": "^0.5.0", "sass-loader": "^4.0.0", 好，我們 npm install 後，就可以正式使用 sass 啦 四、目錄結構建議 依賴的安裝到這里差不多結束了，其它大家需要的可以自定義安裝 下面給出我的目錄建議供大家參考， 這里的 img 目錄放置圖片，script 目錄放置公共的工具函數，style 目錄放置我們的 sass 文件， 你查看 App.vue 文件時不難發現，默認的把樣式文件給到了模塊里，這樣樣式一直跟著模塊 orange 建議大家不要這樣做，因為這樣十分不利於樣式的模塊化，注意區分與模版模塊化的區別， 我們單獨設置 style 目錄，並在目錄當中對 sass 進行模塊化處理（通過 import 引入 sass 模塊） 對應的 App.vue 也變得非常簡潔，代碼如下 <style lang="sass"> @import "/style/base.scss"; </style> 五、rem 適配 對於移動端的開發，rem 適配必不可少，我們可以用多種方式實現，下面給出一種方案 在 index.html 中添加如下代碼 <script> let html = document.documentElement; window.rem = html.getBoundingClientRect().width / 16 ; html.style.fontSize = window.rem + 'px'; </script> 這里基於寬 320px 的屏幕分成了 16 份，也就是 1rem = 20px，目前大多數設計稿都是根據 iphone6 的寬（ 375px ）走的，建議大家在這里分成 25 份，也就是 1rem = 15px，計算起來方便些。 簡單說下 rem 原理：根據 html 的 fontSize 屬性值為基準，其它所有的 rem 值，根據這個基準計算。 我們根據屏幕寬度用 js 動態修改了 html 的 fontSize 屬性值，達到移動端適配的目的 總結 以上就是這篇文章的全部內容了，本文作為移動端配置的基礎篇，深入了解框架後才能繼續構建網站，希望這是一個好的開始，有了這個架子再填充代碼就方便了許多，不用再去考慮開發環境問題了。希望本文的內容對有需要的朋友們能有所幫助。
❾ 在vue腳手架中創建vue項目時輸入指令後為什麼彈出vue源碼
輸入的是什麼指令啊？彈出的源碼有截圖嗎？
❿ 不依賴vue-cli腳手架創建vue項目
我們一般創建vue項目都是通過vue-cli腳手架去創建，這次我嘗試了通過文檔完成所有項目配置包括webpack、ant-design-vue、vue-router、vuex等
項目源碼： https://github.com/wzp123321/myVueJSProByMySelf.git
1.新建項目
2.使用vscode打開項目
3.初始化
4.安裝基本的 npm 包
5.創建文件夾以及文件
6.配置webpack.config.js
在這之前先安裝一些依賴
模板解析依賴：
樣式依賴:
css-loader: https://webpack.docschina.org/loaders/css-loader/
文件載入依賴
解析es6語法依賴: https://github.com/babel/babel-loader
這是一個webpack插件，可簡化HTML文件的創建以服務您的webpack捆綁軟體
現在就可以配置webpack.config.js，如果有什麼不清楚的可以參考官網 https://webpack.docschina.org/configuration/
7.安裝解析依賴 https://github.com/webpack/webpack-dev-server
8.修改package.json文件
9.配置babel,創建.babelrc文件
修改webpack.config.js
如果編譯時報錯的話可能是因為你沒有安裝依賴:
10.主要文件：
app.vue：
index.js:
html文件：
Vue項目文件夾大致參考
1.混入 (mixins) 是一種分發 Vue 組件中可復用功能的非常靈活的方式。混入對象可以包含任意組件選項。當組件使用混入對象時，所有混入對象的選項將被混入該組件本身的選項。
mixins文件夾下可以寫各種調用ajax請求方法的方法，然後在需要調用這些方法請求數據的文件中：
這里的getCourseList文件中有請求需要的參數以及請求完成之後獲取的數據 直接在文件類似this.getAllDemoClass();就能調用方法
2.components通用組件存放文件夾：
在這個文件夾下封裝了項目需要的組件 然後在components下的index.js中向外暴露即可 然後在使用組件的文件中引用components即可
後續：
1.引入ant-design-vue：
具體引入操作可見官網 https://vue.ant.design/docs/vue/introce-cn/
2.引入Vue Router https://router.vuejs.org/zh/installation.html
路由配置文件：router/index.js
3.引入vuex
新建store/index.js
news/index.vue
4.頁面頂部進度條插件Nprogress
使用：