關(guān)于vue編譯版本引入的問題的解決
下班過目遇到一個(gè)錯(cuò)誤
[Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.
根據(jù)錯(cuò)誤提示說明,和搜索之后得出結(jié)論:是項(xiàng)目引入的vue編譯版本不對(duì)
解決方案1
build/webpack.base.conf.js 并設(shè)置vue的alias別名,如下:
resolve: { alias: { vue: 'vue/dist/vue.esm.js' } }
解決方案2
打開src/main.js修改Vue對(duì)象初始化。
new Vue({ el: '#app', router, components: { App }, template: '<App/>' })
改為
new Vue({ el: '#app', router, render: h => h(App) })
原因是,使用 template屬性,需要引入帶編譯器的完整版的vue.esm.js
而如果在.vue文件里面使用
<template> <div></div> </template> <script> export default { name:'name1', data() { return {}; } }; </script>
這種形式,然后使用import引入,則不需要完整版的vue.esm.js,因?yàn)槭褂胿ue-loader時(shí) *.vue文件會(huì)自動(dòng)預(yù)編譯成js。
其實(shí)vuejs官網(wǎng)中已有明確說明
對(duì)不同構(gòu)建版本的解釋(https://cn.vuejs.org/v2/guide/installation.html#%E5%AF%B9%E4%B8%8D%E5%90%8C%E6%9E%84%E5%BB%BA%E7%89%88%E6%9C%AC%E7%9A%84%E8%A7%A3%E9%87%8A)
其他相關(guān)文章:
理順8個(gè)版本vue的區(qū)別(http://www.dbjr.com.cn/article/147538.htm)
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Vue3中如何修改父組件傳遞到子組件中的值(全網(wǎng)少有!)
大家都知道,vue是具有單向數(shù)據(jù)流的傳遞特性,下面這篇文章主要給大家介紹了關(guān)于Vue3中如何修改父組件傳遞到子組件中值的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-04-04Ant?Design?of?Vue的樹形控件Tree的使用及說明
這篇文章主要介紹了Ant?Design?of?Vue的樹形控件Tree的使用及說明,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-10-10vue項(xiàng)目打包為APP,靜態(tài)資源正常顯示,但API請(qǐng)求不到數(shù)據(jù)的操作
這篇文章主要介紹了vue項(xiàng)目打包為APP,靜態(tài)資源正常顯示,但API請(qǐng)求不到數(shù)據(jù)的操作,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2020-09-09element-plus 下拉框?qū)崿F(xiàn)全選的示例代碼
本文主要介紹了element-plus 下拉框?qū)崿F(xiàn)全選的示例代碼,文中通過示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-05-05vue項(xiàng)目中使用Hbuilder打包app 設(shè)置沉浸式狀態(tài)欄的方法
這篇文章主要介紹了vue項(xiàng)目 使用Hbuilder打包app 設(shè)置沉浸式狀態(tài)欄的方法,本文通過實(shí)例代碼效果圖展示給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值 ,需要的朋友可以參考下2018-10-10vue3中實(shí)現(xiàn)拖拽排序代碼示例(vue-draggable-next的使用)
在Vue3中使用拖拽功能時(shí)應(yīng)選用vue-draggable-next插件,傳統(tǒng)的draggable插件不兼容Vue3,可能導(dǎo)致TypeError錯(cuò)誤,安裝后,需在項(xiàng)目中引入并使用,具體步驟包括安裝插件、引入使用、查看效果和相關(guān)說明,需要的朋友可以參考下2024-09-09Vue進(jìn)階之CodeMirror的應(yīng)用小結(jié)
CodeMirror支持在線編輯代碼,風(fēng)格包括js, java, php, c++等等100多種語(yǔ)言,下面這篇文章主要來(lái)和大家講講CodeMirror的應(yīng)用,感興趣的可以了解一下2023-06-06