■■
■■ばーじょん
windows
ubuntu18.04
Node.jsv8.10.0
NPMv5.6.0
Yarn1.9.4
Nuxt2.0.0
■■
■環境構築
Nodeのインストール
ono@DESKTOP-RBPIP9E:~/sandbox$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.2/install.sh | bash
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 13527 100 13527 0 0 15477 0 --:--:-- --:--:-- --:--:-- 15477
=> Downloading nvm from git to '/home/ono/.nvm'
=> Cloning into '/home/ono/.nvm'...
remote: Enumerating objects: 288, done.
remote: Counting objects: 100% (288/288), done.
remote: Compressing objects: 100% (254/254), done.
remote: Total 288 (delta 33), reused 112 (delta 22), pack-reused 0
Receiving objects: 100% (288/288), 146.58 KiB | 444.00 KiB/s, done.
Resolving deltas: 100% (33/33), done.
Checking out files: 100% (264/264), done.
=> Compressing and cleaning up git repository
=> Appending nvm source string to /home/ono/.bashrc
=> Appending bash_completion source string to /home/ono/.bashrc
=> You currently have modules installed globally with `npm`. These will no
=> longer be linked to the active version of Node when you install a new node
=> with `nvm`; and they may (depending on how you construct your `$PATH`)
=> override the binaries of modules installed with `nvm`:
/usr/local/lib
├── n@6.7.0
=> If you wish to uninstall them at a later point (or re-install them under your
=> `nvm` Nodes), you can remove them from the system Node as follows:
$ nvm use system
$ npm uninstall -g a_module
=> Close and reopen your terminal to start using nvm or run the following to use it now:
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion" # This loads nvm bash_completion
ono@DESKTOP-RBPIP9E:~/sandbox$ export NVM_DIR="$HOME/.nvm"
ono@DESKTOP-RBPIP9E:~/sandbox$ [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
ono@DESKTOP-RBPIP9E:~/sandbox$ [ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"
ono@DESKTOP-RBPIP9E:~/sandbox$ command -v nvm
nvm
ono@DESKTOP-RBPIP9E:~/sandbox$ nvm ls-remote --lts
v4.2.0 (LTS: Argon)
Creating default alias: default -> v8.10.0
ono@DESKTOP-RBPIP9E:~/sandbox$ node --version
v8.10.0
ono@DESKTOP-RBPIP9E:~/sandbox$ npm --version
5.6.0
ono@DESKTOP-RBPIP9E:~/sandbox$ npm outdated
ono@DESKTOP-RBPIP9E:~/sandbox$ npm update
■■
■■
Yarnのインストール
権限で弾かれまくったがなぜかできている、あやしい
ono@DESKTOP-RBPIP9E:~/sandbox$ yarn -V
yarn install v1.22.5
info No lockfile found.
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved lockfile.
Done in 0.31s.
■■
■■
VueCLIによるアプリのひな型作成
ono@DESKTOP-RBPIP9E:~/sandbox$ npm i -g @vue/cli @vue/cli-init
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated @hapi/joi@15.1.1: Switch to 'npm install joi'
npm WARN deprecated @hapi/hoek@8.5.1: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/address@2.1.4: Moved to 'npm install @sideway/address'
npm WARN deprecated @hapi/bourne@1.3.2: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/topo@3.1.6: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated har-validator@5.1.5: this library is no longer supported
npm WARN notice [SECURITY] set-value has the following vulnerability: 1 high. Go here for more details: https://www.npmjs.com/advisories?search=set-value&version=2.0.1 - Run `npm i npm@latest -g` to upgrade your npm version, and then `npm audit` to get more info.
npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
npm WARN notice [SECURITY] lodash has the following vulnerability: 1 high. Go here for more details: https://www.npmjs.com/advisories?search=lodash&version=4.17.20 - Run `npm i npm@latest -g` to upgrade your npm version, and then `npm audit` to get more info.
npm WARN deprecated chokidar@2.1.8: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated fsevents@1.2.13: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
npm WARN deprecated vue-cli@2.9.6: This package has been deprecated in favour of @vue/cli
npm WARN deprecated coffee-script@1.12.7: CoffeeScript on NPM has moved to "coffeescript" (no hyphen)
> yarn@1.22.10 preinstall /home/ono/.nvm/versions/node/v8.10.0/lib/node_modules/@vue/cli/node_modules/yarn
> :; (node ./preinstall.js > /dev/null 2>&1 || true)
/home/ono/.nvm/versions/node/v8.10.0/bin/vue -> /home/ono/.nvm/versions/node/v8.10.0/lib/node_modules/@vue/cli/bin/vue.js
> core-js@3.7.0 postinstall /home/ono/.nvm/versions/node/v8.10.0/lib/node_modules/@vue/cli/node_modules/core-js
> node -e "try{require('./postinstall')}catch(e){}"
Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library!
The project needs your help! Please consider supporting of core-js on Open Collective or Patreon:
> https://opencollective.com/core-js
> https://www.patreon.com/zloirock
Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -)
> @apollo/protobufjs@1.0.5 postinstall /home/ono/.nvm/versions/node/v8.10.0/lib/node_modules/@vue/cli/node_modules/@apollo/protobufjs
> node scripts/postinstall
> nodemon@1.19.4 postinstall /home/ono/.nvm/versions/node/v8.10.0/lib/node_modules/@vue/cli/node_modules/nodemon
> node bin/postinstall || exit 0
Love nodemon? You can now support the project via the open collective:
> https://opencollective.com/nodemon/donate
> ejs@2.7.4 postinstall /home/ono/.nvm/versions/node/v8.10.0/lib/node_modules/@vue/cli/node_modules/ejs
> node ./postinstall.js
Thank you for installing EJS: built with the Jake JavaScript build tool (https://jakejs.com/)
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules/@vue/cli/node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN @vue/compiler-sfc@3.0.2 requires a peer of vue@3.0.2 but none is installed. You must install peer dependencies yourself.
+ @vue/cli-init@4.5.8
+ @vue/cli@4.5.8
added 1579 packages in 356.38s
■vueの確認
ono@DESKTOP-RBPIP9E:~/sandbox$ vue -V
You are using Node v8.10.0.
Node.js 8.x has already reached end-of-life and will not be supported in future major releases.
It's strongly recommended to use an active LTS version instead.
@vue/cli 4.5.8
■プロジェクト作成
ono@DESKTOP-RBPIP9E:~/sandbox$ vue init nuxt-community/starter-template my-first-nuxt-app
You are using Node v8.10.0.
Node.js 8.x has already reached end-of-life and will not be supported in future major releases.
It's strongly recommended to use an active LTS version instead.
? Project name my-first-nuxt-app
? Project description Nuxt.js project
? Author
vue-cli · Generated "my-first-nuxt-app".
To get started:
cd my-first-nuxt-app
npm install # Or yarn
npm run dev
yarn でnode8.10.0で怒られたので、node12をインストールしてからyarn
ono@DESKTOP-RBPIP9E:~/sandbox/my-first-nuxt-app$ yarn
yarn install v1.22.5
info No lockfile found.
[1/4] Resolving packages...
warning nuxt > @nuxt/static@1.0.0: this feature has been moved to the core. you can directly use nuxt generate
warning nuxt > @nuxt/cli > @nuxt/static@1.0.0: this feature has been moved to the core. you can directly use nuxt generate
warning nuxt > @nuxt/webpack > @nuxt/babel-preset-app > core-js@2.6.11: core-js@<3 is no longer maintained and not recommended for usage due to the number of issues. Please, upgrade your dependencies to the actual version of core-js@3.
warning nuxt > @nuxt/webpack > webpack > watchpack > watchpack-chokidar2 > chokidar@2.1.8: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
warning nuxt > @nuxt/webpack > webpack > watchpack > watchpack-chokidar2 > chokidar > fsevents@1.2.13: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
warning nuxt > @nuxt/webpack > webpack > micromatch > snapdragon > source-map-resolve > resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
warning nuxt > @nuxt/webpack > webpack > micromatch > snapdragon > source-map-resolve > urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
warning eslint > file-entry-cache > flat-cache > circular-json@0.3.3: CircularJSON is in maintenance only, flatted is its successor.
warning eslint-loader@2.2.1: This loader has been deprecated. Please use eslint-webpack-plugin
[2/4] Fetching packages...
info fsevents@2.1.3: The platform "linux" is incompatible with this module.
info "fsevents@2.1.3" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents@1.2.13: The platform "linux" is incompatible with this module.
info "fsevents@1.2.13" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning "nuxt > @nuxt/components@1.1.1" has unmet peer dependency "webpack@^4.0.0".
warning " > eslint-loader@2.2.1" has unmet peer dependency "webpack@>=2.0.0 <5.0.0".
[4/4] Building fresh packages...
success Saved lockfile.
Done in 200.94s.
ono@DESKTOP-RBPIP9E:~/sandbox/my-first-nuxt-app$ yarn dev
yarn run v1.22.5
$ nuxt
ℹ NuxtJS collects completely anonymous data about usage. 01:53:54
This will help us improving Nuxt developer experience over the time.
Read more on https://git.io/nuxt-telemetry
? Are you interested in participation? Yes
╭───────────────────────────────────────╮
│ │
│ Nuxt.js @ v2.14.7 │
│ │
│ ▸ Environment: development │
● Client █████████████████████████ building (27%) 146/166 modules 20 active
node_modules/core-js/modules/_cof.js
● Server █████████████████████████ building (12%) 18/19 modules 1 active
babel-loader › .nuxt/router.scrollBehavior.js
ℹ Initial build may take a while 01:54:26
✔ Builder initialized 01:54:26
✔ Nuxt files generated 01:54:27
● Client █████████████████████████ building (11%) 11/17 modules 6 active
...-loader › eslint-loader › .nuxt/components/nuxt-link.client.js
● Server █████████████████████████ building (10%) 5/9 modules 4 active
babel-loader › .nuxt/components/nuxt-link.server.js
![技術語り-Tech Blog[JP]](https://blogger.googleusercontent.com/img/a/AVvXsEiYsL2e14T1O3H3pP9BUj4BxNQQDgWUK-pNhtt6X8syLNp1zvyRWOG_UEv_Gcanv4Nix1_-8MCZL02odSwi69Cbmp6WJeoNDX8f7GQSPH25NUW3dtNTkcGdKhA0sRemc7CD46aj4pMhd8WzzKViOuxBpGmZ5DaFru2sTTv9Jie9aXa98EppzJj1P3lUvyY=s175)
