待望のNuxt v2.6リリース! 〜 nuxt-tsからの移行編〜
本日(2019年4月5日)ようやくv2.6がリリースされました
Release v2.6.0 · nuxt/nuxt.js
v2.5からnuxt-ts
不要でTypeScriptサポートが不要になりましたが、その辺りを紹介します。
(2019/8/22追記)
v2.9のリリースにより、TS周りに変更があったので移行手順を以下の記事に書きました。
Nuxt.js 2.9でのTypeScript対応 - Qiita
tl;dr
- 以前書いたTypeScript版Nuxtであるnuxt-tsに移行してJSファイルを駆逐したからの差分
- v2.5はGAE上で動作しなかったが、v2.6では動作するようになった
nuxt-ts
からの移行手順
nuxt-ts
からの移行手順
冒頭に書いた通り、v2.5からnuxt-ts
は不要になり、nuxt
があればよくなりました。
nuxt-ts
を使っていた人用に移行手順を書いておきます。
$ yarn remove nuxt-ts
$ yarn add nuxt ts-node @nuxt/typescript
リリースノートには@nuxt/typescript
をdevDependencies
として追加するように書かれていますが、これだとGoogle App Engine(GAE)上では動きません。(詳細は後述)
package.json
でnuxt-ts
コマンドを使っていたところをnuxt
に変更します。
"scripts": {
- "dev": "nuxt-ts",
- "build": "nuxt-ts build",
- "start": "nuxt-ts start",
+ "dev": "nuxt",
+ "build": "nuxt build",
+ "start": "nuxt start",
},
tsconfig.json
のextends
を削除します。1
{
- "extends": "@nuxt/typescript",
"compilerOptions": {
"baseUrl": ".",
"types": [
"@types/node",
"@nuxt/vue-app"
]
},
}
v2.5以降からnuxt.config.ts
用の型定義が提供されるようになったのでそちらに移行します。
- import {Configuration} from 'webpack'
- import {Context} from '@nuxt/vue-app'
+ import NuxtConfiguration from '@nuxt/config'
- const nuxtConfig = {
+ const nuxtConfig: NuxtConfiguration = {
build: {
- extend (config: Configuration, { isClient }: Context) {
+ extend (config, { isClient }) {
// Extend only webpack config for client-bundle
if (isClient) {
config.devtool = '#source-map'
}
}
}
}
module.exports = nuxtConfig
随分とシンプルになりました
@types/webpack
も不要になったので消しておきましょう。
$ yarn remove @types/webpack
@types/xxx
をdevDependencies
へ
nuxt start
時の挙動がv2.5から変更になりました。
以下のソースから分かるようにトランスパイルだけを行うようになっています。
https://github.com/nuxt/nuxt.js/blob/dev/packages/cli/src/command.js#L96-L99
v2.4では前の記事で書いたように、nuxt star
時に型チェックもしていたため、@types/xxx
の型定義ファイルをpackage.jsonのdependencies
に宣言しておく必要がありましたが、これでdevDependencies
に宣言すればよくなりました。
GAE Node Standard Enviromentで動かす
v2.5では起動しない
v2.5でnuxt-ts
が廃止され、nuxt
一本になったのですがGAEで動きませんでした。
これはv2.5ではnuxt
コマンドを使うと常にtsconfig.json
への書き込みが発生していたためです。
PaaSではよくある制限ですが、GAEでは特定パス以外2へのファイル書き込みは許可されていません。
なので、tsconfig.json
に書きこむときにエラーとなり起動できない状態でした。
v2.6からtsconfig.json
が存在しなかったときだけ書き込まれるようになったので、tsconfig.json
を事前に用意しておけば起動できるようになりました
@nuxt/typescript
はdependencies
へ
GAE上で動かすためには、yarn install && yarn build
した状態でgcloud app deploy
する必要があります。
gcloud app deploy
はNODE_ENV=production
環境でyarn install
が実行されます。
このとき@nuxt/typescript
をdevDependencies
に宣言しておくと、@nuxt/typescript
がないといわれ、起動に失敗します。
なので@nuxt/typescript
はdependencies
に書かれている必要があります。
nuxt start
がtranspileOnly
になったので、GAEのinstance_class
を最弱のF1にしても起動するかな?と思ったのですが、無理でした3。
なのでF2以上を使うことをお勧めします。
(追記 2019/7/17)
instance_class
がスペックアップされたのでF1で動作するようになりました
App Engine second generation runtimes now get double the memory; plus Go 1.12 and PHP 7.3 now generally available | Google Cloud Blog
Author And Source
この問題について(待望のNuxt v2.6リリース! 〜 nuxt-tsからの移行編〜), 我々は、より多くの情報をここで見つけました https://qiita.com/iwata@github/items/f798cc6cc24ac41a74d9著者帰属:元の著者の情報は、元の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 .