Memo

メモ > 技術 > フレームワーク: Nuxt.js > Vagrant上で実行する
Vagrant上で実行する

※VagrantでもDockerでも、Windowsとの共有ディレクトリでnpxコマンドが正しく動作しない
  symlink が使えないことが原因となっているみたい
  共有ディレクトリの外に移動させれば動作するようだが、それはそれで管理の手間が増える
  ローカルでは素直に、Windowsにインストールしたnode.jsで作業するほうが無難かも

■基本的な環境の構築

※SELinuxを無効にしておく（nginxから参照できなくなる）
※nginx_mariadbのPlaybookで構築

$ sudo su -
# python --version
Python 2.7.5
# yum -y install epel-release
# yum -y install ansible
# ansible --version
ansible 2.9.7
# vi /etc/ansible/hosts
[localhost]
127.0.0.1


# exit

$ cd /var/www/ansible
$ ansible-playbook site.yml --connection=local
http://192.168.33.10/■Nuxt.jsを実行

※Windowsとの共有ディレクトリでnpxコマンドが正しく動作しない
  今回は、共有ディレクトリ外に移動してプロジェクトを作成している

AmazonLinux2へNuxt.js導入手順 - Qiita
https://qiita.com/deehii/items/58e6da680f322fce10ff$ curl --silent --location https://rpm.nodesource.com/setup_12.x | sudo bash -
$ sudo yum install -y nodejs
$ node --version
v12.16.3
$ npm --version
6.14.4

$ sudo npm install -g @vue/cli
$ vue --version
@vue/cli 4.3.1

$ cd
$ npx create-nuxt-app my-project

create-nuxt-app v2.15.0
   Generating Nuxt.js project in my-project
 Project name my-project
 Project description My splendiferous Nuxt.js project
 Author name 
 Choose programming language JavaScript
 Choose the package manager Npm
 Choose UI framework None
 Choose custom server framework Express
 Choose Nuxt.js modules (Press <space> to select, <a> to toggle all, <i> to invert selection)
 Choose linting tools (Press <space> to select, <a> to toggle all, <i> to invert selection)
 Choose test framework None
 Choose rendering mode Universal (SSR)
 Choose development tools (Press <space> to select, <a> to toggle all, <i> to invert selection)

$ cd my-project
$ npm run dev
■エラー

プロジェクト作成時、以下のエラーになることがある

npm ERR! code EPROTO
npm ERR! syscall symlink
npm ERR! path ../@babel/parser/bin/babel-parser.js
npm ERR! dest /var/www/my-project/node_modules/.bin/parser
npm ERR! errno -71
npm ERR! EPROTO: protocol error, symlink '../@babel/parser/bin/babel-parser.js' -> '/var/www/my-project/node_modules/.bin/parser'


Windowsとの同期ディレクトリでは symlink を使用できないため
以下のように、同期ディレクトリの外に移動してプロジェクトを作成する
（その後同期ディレクトリに移動させても正しく実行できなかった。要調査）

$ cd
$ npx create-nuxt-app my-project
$ cd my-project
$ npm run dev


WindowsのDocker環境でnpm install実行時にエラーが出た場合の対処法メモ - Qiita
https://qiita.com/Y-Kanoh/items/58815aafb7346930f370

[メモ]vagrantでnpm install中に出たエラーまとめ - Qiita
https://qiita.com/yosida001/items/3c21acc79adf977e87c0

また、502エラーになる場合、SELinuxが原因となっている可能性がある

nginxで同一ホスト内にリバースプロキシしようとするとエラーが出る - Qiita
https://qiita.com/rikudai/items/884b203f4a72cfb62c02
Memo

Advertisement
