vue-cliで作成したプロジェクトにvue.config.jsを追加する
時間がないから今すぐ知りたい
@vue/cli 4.4.1のデフォルトで作成すると存在しないので、プロジェクトルートに作る。
環境
macOS Catalina 10.15.5
@vue/cli: 4.4.1
今回やりたいこと
vue-cliで作成したプロジェクトのApp.vueにVue.jsの公式ガイドの「要素間のトランジション」を書いたらエラーになった。
chrome_devtool_console
[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.
found in
---> <VA>
<App> at src/App.vue
<Root>
上記のエラーメッセージで検索すると以下がヒットする。
回答として貼られているのはvue.config.jsのリファレンス。
runtimeCompilerをtrueにすれば本エラーの回避ができるようだ。
さぁ、vue.config.jsで設定しよう。
あれ？vue.config.jsはどこ？
ところがvue-cliで作成したプロジェクトにはvue.config.jsが存在しない。
tree
.(プロジェクトルート)
├── README.md
├── babel.config.js
├── node_modules
├── package.json
├── public
├── src
│ ├── App.vue
│ ├── assets
│ │ └── logo.png
│ ├── components
│ │ └── HelloWorld.vue
│ └── main.js
└── yarn.lock
なければ作ろう
プロジェクトルートにvue.config.jsという名前で作成する。
tree
.(プロジェクトルート)
├── README.md
├── babel.config.js
├── node_modules
├── package.json
├── public
├── src
│ ├── App.vue
│ ├── assets
│ │ └── logo.png
│ ├── components
│ │ └── HelloWorld.vue
│ └── main.js
├── vue.config.js // <- 新規作成
└── yarn.lock
記載する内容は以下。
vue.config.js
module.exports = {
runtimeCompiler: true
}
サーバーを起動している場合、vue.config.jsを読み込むためにここで一旦再起動を行う。
何故書いた？
少なくとも3回は忘れたので自分で記事を書いた。
Author And Source
この問題について(vue-cliで作成したプロジェクトにvue.config.jsを追加する), 我々は、より多くの情報をここで見つけました https://qiita.com/Naoki_kkc/items/5a6f4b661dd0bf879fa9著者帰属：元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .