您好,登錄后才能下訂單哦!
最開始的項目開發中,我們如果使用第三方的庫我們會直接在項目中直接使用 script 元素標簽引入即可。
<script src="../xxx.js"></script>
Vue 我們也可以這種引入的方式
<div id="root">{{name}}</div> <script src="./dist/vue.js"></script> <script> const vm = new Vue({ el: '#root', data: { name: 'Vue' } }) </script>
隨著前端的發展我們出現了模塊化的開發方式,例如異步(AMD)、同步(CommonJS)等等。
在我們正式開始 Vue 項目開始的時候,我們現在安裝一個 Vue Devtools 一個官方的 Vue 調試 chrome 插件,安裝之后我們在 chrome 的控制臺就可以看到我們創建的 Vue 的對象實例。
Vue-CLI
Vue 給我們提供了上述所有方式的項目引入方式,不但如此,Vue 還給我們提供了一個目前非常流行,非常牛逼的腳手架(Vue CLI )工具,它能在短短的幾分鐘之內就能構建一個完整的單頁面應用 (SPA)項目。其中包含:熱加載、校驗、打包等構建項目等工具;下面我們來一步一步的構件一個新的項目。
安裝工具
//npm npm install -g @vue/cli //yarn yarn global add @vue/cli
安裝完成以后我們驗證下有沒有安裝成功,執行下面命令后如果安裝成功后,會顯示版本號,我安裝的版本是 3.0.4
vue --version
如果你和我一樣恭喜你你安裝成功了,如果沒有安裝成功你可以查看下權限的問題或者該用 cnpm 試試。
安裝成功之后,我們執行以下命令就可以創建一個完整的項目案例。
vue create my-project
執行上述命令以后,會讓我們選擇是按照默認(default)的配置,還是選擇執行配置,如果你已經非常熟悉了腳手架工具或者默認的配置你滿足不了你的需求,你可以選擇自己行配置,不過這里還是建議不太熟悉的同學還是使用默認配置就行。
等待安裝完成之后,我們執行下面命令就可以看到我們的初始化項目了。
cd my-project npm run serve
我這里給的是 8080 端口,我們本地訪問 localhost:8080 查看我們的初始化項目
總結
以上所述是小編給大家介紹的Vue2.5學習筆記之如何在項目中使用和配置Vue ,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對億速云網站的支持!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。