2017-04-13 14 views
1

webpackでVueを使用したいと思います。私はすべての依存関係をインストールしましたが、私は、コンパイル後に警告しました:[ヴューが警告]Vue and webpack warning

:あなたはランタイムのみの テンプレートコンパイラが利用できないのVueの構築を使用しています。テンプレート をレンダリング関数にあらかじめコンパイルするか、コンパイラが組み込まれたビルドを使用してください。

マイapp.js( で見つかった):

import Vue from 'vue'; 
import test from './components/cartItem.vue'; // Simple <template> with string 

new Vue({ 
    el: '#js-cart-list' 
}); 

マイpackage.json:

"devDependencies": { 
    "autoprefixer": "^6.4.1", 
    "babel-core": "^6.14.0", 
    "babel-loader": "^6.2.5", 
    "babel-polyfill": "^6.23.0", 
    "babel-preset-es2015": "^6.14.0", 
    "babel-preset-stage-2": "^6.13.0", 
    "browser-sync": "^2.14.3", 
    "cross-env": "^3.2.4", 
    "css-loader": "^0.24.0", 
    "css-mqpacker": "^5.0.1", 
    "eslint": "^3.18.0", 
    "eslint-loader": "^1.6.3", 
    "exports-loader": "^0.6.3", 
    "extract-text-webpack-plugin": "^2.1.0", 
    "goog-webfont-dl": "^1.0.1", 
    "node-sass": "^3.8.0", 
    "postcss-loader": "^0.11.1", 
    "progress-bar-webpack-plugin": "^1.9.0", 
    "sass-loader": "^4.0.1", 
    "script-loader": "^0.7.0", 
    "slick-carousel": "^1.6.0", 
    "style-loader": "^0.13.1", 
    "vue-loader": "^11.3.4", 
    "vue-template-compiler": "^2.2.6", 
    "webpack": "^2.0.0", 
    "webpack-notifier": "^1.5.0" 
    }, 
    "dependencies": { 
    "family.scss": "^1.0.8", 
    "foundation-sites": "^6.3.0", 
    "jquery": "^2.2.0", 
    "motion-ui": "^1.1.1", 
    "select2": "^4.0.3", 
    "vue": "^2.2.6" 
    } 

それはWebPACKのでVUEを使用して初めてです、誰もがアイデアを持っていますか?

ありがとうございました!

+0

あなた 'webpack.config.js'を含めるようにあなたの質問を編集してください - 問題はどこにあるのか、それはほぼ確実です。 –

答えて

0

あなたのWebPACKの設定ファイルに以下を追加する必要があります

resolve: { 
    alias: { 
    vue: 'vue/dist/vue.js' 
    } 
} 

コンポーネントのプリコンパイルされた、あなたはまた、* .vueファイルでそれらのすべてを置く必要があります。

はこれを見てください:https://github.com/vuejs-templates/webpack/issues/215

+0

ありがとう、よかった! –

+0

は、 "main.js"ファイルの名前を.vueに変更できるようです – Ehvince

関連する問題