Nuxt.jsのプロジェクトをgitで管理して、他のPCでCloneしたときのこと。
ライブラリが不足して動かない。
これを解決するために、1番はじめにやることについてです！
gitのpushしているもの
ライブラリなどは省いたものをgitで管理しています。
こんな感じ。
| 作成プロジェクト | Cloneしたプロジェクト |
|---|---|
| store | store |
| static | static |
| plugins | plugins |
| pages | pages |
| node_modules | ★なし★ |
| assets | assets |
| components | components |
| middleware | middleware |
| layouts | layouts |
| test | test |
| .babelrc | .babelrc |
| .editorconfig | .editorconfig |
| .gitignore | .gitignore |
| jest.config.js | jest.config.js |
| .eslintrc.js | .eslintrc.js |
| nuxt.config.js | nuxt.config.js |
| package-lock.json | package-lock.json |
| package.json | package.json |
| README.md | README.md |
| .prettierrc | .prettierrc |
これでnpm run devはエラーが出る
当たり前だが、このままnpm run devで実行するとエラーが出る。
本来あるべきモジュールがない状態で動かそうとしているので当たり前だ。
こんな感じ。
表示を開く
C:\work\firebase-nuxt-sample>npm run dev > TestNuxtProject@1.0.0 dev C:\work\firebase-nuxt-sample > nuxt 'nuxt' は、内部コマンドまたは外部コマンド、 操作可能なプログラムまたはバッチ ファイルとして認識されていません。 npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! TestNuxtProject@1.0.0 dev: `nuxt` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the TestNuxtProject@1.0.0 dev script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm WARN Local package.json exists, but node_modules missing, did you mean to install? npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\lis\AppData\Roaming\npm-cache\_logs\2019-03-09T08_40_54_784Z-debug.log
もはやnuxtすらない状態である。
Nuxtのモジュールをインストールする
ということでモジュールを追加していく。
npm install --save nuxt
を実行します。
表示を開く
C:\work\firebase-nuxt-sample>npm install --save nuxt
> nodemon@1.18.10 postinstall C:\work\firebase-nuxt-sample\node_modules\nodemon
> node bin/postinstall || exit 0
> nuxt@2.4.5 postinstall C:\work\firebase-nuxt-sample\node_modules\nuxt
> opencollective || exit 0
:-:
.==-+:
.==. :+- .-=-
.==. :==++-+=.
:==. -**: :+=.
:+- :*+++. .++.
:+- -*= .++: .=+.
-+: =*- .+*: .=+:
-+: .=*- .=*- =+:
.==: .+*: -*- -+-
.=+:.....:+*-.........:=*=..=*-
.-=------=++============++====:
Thanks for installing nuxtjs
Please consider donating to our open collective
to help us maintain this package.
Number of contributors: 172
Number of backers: 179
Annual budget: US$ 46,381
Current balance: US$ 13,430
Donate: https://opencollective.com/nuxtjs/donate
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.7 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.7: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
+ nuxt@2.4.5
added 1592 packages from 875 contributors and audited 33188 packages in 72.818s
found 63 low severity vulnerabilities
run `npm audit fix` to fix them, or `npm audit` for details
node_modulesが追加される
nuxtのインストールを行うと、プロジェクト内に「node_modulesフォルダ」が追加されています！
中を見ると、create-nuxt-appしたときみたいに、モジュールが沢山入っています！
おそらく元通りでしょうか！
改めて実行する
改めて
npm run dev
してみます。
表示を開く
C:\work\firebase-nuxt-sample\pages\index.vue
6:24 warning Expected 1 line break before closing bracket, but no line breaks found vue/html-closing-bracket-newline
15:66 warning Expected 1 space before '}}', but not found vue/mustache-interpolation-spacing
✖ 2 problems (0 errors, 2 warnings)
0 errors and 2 warnings potentially fixable with the --fix option.
friendly-errors 17:46:59
You may use special comments to disable some warnings. friendly-errors 17:46:59
Use // eslint-disable-next-line to ignore the next line. friendly-errors 17:46:59
Use /* eslint-disable */ to ignore all warnings in a file. friendly-errors 17:46:59
i Waiting for file changes 17:46:59
╭─────────────────────────────────────────────╮
│ │
│ Nuxt.js v2.4.5 │
│ Running in development mode (universal) │
│ Memory usage: 197 MB (RSS: 330 MB) │
│ │
│ Listening on: http://localhost:3000 │
│ │
╰─────────────────────────────────────────────╯
いつものlocalhost:3000にアクセスしてね表示まで出ました！
アクセスすると、ちゃんと表示することができました！
あとがき
Nuxtのプロジェクトをgit clone後に動かすための方法についてでした！
超絶初心者が故に、こんなことにすら躓いています……
よくよく考えたら簡単にわかりそうな話ですが、知らないが故に
「なにこれできない……」
と一人ビクビクしていました(笑)
もし同じように困っていたら試してみてください！
勉強中に書いている記事はコチラ。
