質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
86.02%
Nuxt.js

Nuxt.jsは、ユニバーサルなSPAが開発可能なVue.jsベースのフレームワーク。UIの描画サポートに特化しており、SSRにおけるサーバーサイドとクライアントサイドのUIレンダリングなどさまざまな機能を持ちます。

Yarn

Yarnは、Facebook/Exponent/Google/Tildeが開発したJavaScriptのパッケージマネージャ。npmよりもインストールが速く、厳密にモジュールのバージョンを固定できるなど、npmの問題を解決。npmと互換性があり、同じpackage.jsonを使用できます。

Q&A

受付中

Nuxt.jsのhardsourceエラーを解決したい。

toshihirokato
toshihirokato

総合スコア20

Nuxt.js

Nuxt.jsは、ユニバーサルなSPAが開発可能なVue.jsベースのフレームワーク。UIの描画サポートに特化しており、SSRにおけるサーバーサイドとクライアントサイドのUIレンダリングなどさまざまな機能を持ちます。

Yarn

Yarnは、Facebook/Exponent/Google/Tildeが開発したJavaScriptのパッケージマネージャ。npmよりもインストールが速く、厳密にモジュールのバージョンを固定できるなど、npmの問題を解決。npmと互換性があり、同じpackage.jsonを使用できます。

0回答

0グッド

0クリップ

4169閲覧

投稿2020/01/15 00:59

編集2020/01/20 06:25

前提・実現したいこと

Nuxt.jsのビルドスピードを上げるために、hard-source-webpack-pluginをインストールしたが、
ターミナルにて以下のエラーが発生したので解決したいです。

発生している問題・エラーメッセージ

terminal

1 ERROR [hardsource:204cee08] Could not freeze ./.nuxt/router.js: Cannot read property 'hash' of undefined

該当のソースコード

nuxt

1import colors from 'vuetify/es5/util/colors' 2// import webpack from 'webpack' 3// import NuxtConfiguration from '@nuxt/config' 4 5// const config: NuxtConfiguration = { 6// build: { 7// extend(config, ctx) { 8// config.externals = { 9// moment: 'moment' 10// } 11// } 12// } 13// } 14 15// export default config 16 17export default { 18 mode: 'spa', 19 srcDir: 'app', 20 /* 21 ** Headers of the page 22 */ 23 head: { 24 script: [ 25 ], 26 titleTemplate: '%s - ' + process.env.npm_package_name, 27 title: process.env.npm_package_name || '', 28 meta: [ 29 { charset: 'utf-8' }, 30 { name: 'viewport', content: 'width=device-width, initial-scale=1' }, 31 { hid: 'description', name: 'description', content: process.env.npm_package_description || '' } 32 ], 33 link: [ 34 { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' } 35 ] 36 }, 37 /* 38 ** Customize the progress-bar color 39 */ 40 loading: { color: '#fff' }, 41 /* 42 ** Global CSS 43 */ 44 css: [ 45 ], 46 /* 47 ** Plugins to load before mounting the App 48 */ 49 plugins: [ 50 '~/plugins/firebase' 51 ], 52 /* 53 ** Nuxt.js dev-modules 54 */ 55 buildModules: [ 56 // Doc: https://github.com/nuxt-community/eslint-module 57 '@nuxtjs/eslint-module', 58 '@nuxtjs/vuetify' 59 ], 60 /* 61 ** Nuxt.js modules 62 */ 63 modules: [ 64 // Doc: https://axios.nuxtjs.org/usage 65 '@nuxtjs/axios' 66 ], 67 /* 68 ** Axios module configuration 69 ** See https://axios.nuxtjs.org/options 70 */ 71 axios: { 72 }, 73 /* 74 ** vuetify module configuration 75 ** https://github.com/nuxt-community/vuetify-module 76 */ 77 vuetify: { 78 customVariables: ['~/assets/variables.scss'], 79 theme: { 80 dark: false, 81 themes: { 82 light: { 83 primary: colors.purple, 84 secondary: colors.grey.darken1, 85 accent: colors.shades.black, 86 error: colors.red.accent3 87 }, 88 dark: { 89 primary: colors.blue.darken2, 90 accent: colors.grey.darken3, 91 secondary: colors.amber.darken3, 92 info: colors.teal.lighten1, 93 warning: colors.amber.base, 94 error: colors.deepOrange.accent4, 95 success: colors.green.accent3 96 } 97 } 98 } 99 }, 100 /* 101 ** Build configuration 102 */ 103 build: { 104 publishPath: [ 105 ], 106 vendeer: ['moment'], 107 analyze: false, 108 /* 109 ** You can extend webpack config here 110 */ 111 extend (config, ctx) { 112 const HardSourceWebpackPlugin = require('hard-source-webpack-plugin') 113 config.plugins.push(new HardSourceWebpackPlugin()) 114 115 config.externals = { 116 moment: 'moment' 117 } 118 } 119 } 120} 121

試したこと

こちらのgithub.comを参考に、node_modules/.cacheを削除してyarn run devを実行しましたが、解決しませんでした。

また、こちらの記事を参考に、webpackをアップデートしようとしましたが、これ以上アップデートできず解決に至りませんでした。

補足情報(FW/ツールのバージョンなど)

package

1{ 2 "name": "", 3 "version": "1.0.0", 4 "description": "My epic Nuxt.js project", 5 "author": "", 6 "private": true, 7 "scripts": { 8 "dev": "nuxt", 9 "build": "nuxt build", 10 "start": "nuxt start", 11 "generate": "nuxt generate", 12 "lint": "eslint --ext .js,.vue --ignore-path .gitignore ." 13 }, 14 "dependencies": { 15 "@nuxtjs/axios": "^5.8.0", 16 "analyze": "^0.0.14", 17 "chart.js": "^2.9.3", 18 "config": "^3.2.4", 19 "eslint-plugin-import": "^2.19.1", 20 "eslint-plugin-vue": "^6.1.2", 21 "eslint-scope": "^5.0.0", 22 "firebase": "^7.6.0", 23 "hard-source-webpack-plugin": "^0.13.1", 24 "latest": "^0.2.0", 25 "nuxt": "^2.10.2", 26 "stylus": "^0.54.7", 27 "stylus-loader": "^3.0.2", 28 "vue-chartjs": "^3.5.0", 29 "webpack": "^4.41.5", 30 "yarn": "^1.21.1" 31 }, 32 "devDependencies": { 33 "@nuxtjs/eslint-config": "^2.0.0", 34 "@nuxtjs/eslint-module": "^1.1.0", 35 "@nuxtjs/vuetify": "^1.9.1", 36 "babel-eslint": "^10.0.3", 37 "eslint": "^6.7.2", 38 "eslint-plugin-nuxt": ">=0.5.0" 39 } 40} 41

追記

改めてターミナルを確認してみると、以下のwarnが発生しておりましたので追記させていただきます。

terminal

1 WARN [hardsource:204cee08] Using 28 MB of disk space. 2 3 WARN [hardsource:204cee08] Tracking node dependencies with: yarn.lock. 4 5 WARN [hardsource:204cee08] Node dependencies changed. Building new cache.

調べたところ、上記の3つのwarnは問題ない挙動だそうです。

以下のような質問にはグッドを送りましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

グッドが多くついた質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

下記のような質問は推奨されていません。

  • 間違っている
  • 質問になっていない投稿
  • スパムや攻撃的な表現を用いた投稿

適切な質問に修正を依頼しましょう。

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
86.02%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

Nuxt.js

Nuxt.jsは、ユニバーサルなSPAが開発可能なVue.jsベースのフレームワーク。UIの描画サポートに特化しており、SSRにおけるサーバーサイドとクライアントサイドのUIレンダリングなどさまざまな機能を持ちます。

Yarn

Yarnは、Facebook/Exponent/Google/Tildeが開発したJavaScriptのパッケージマネージャ。npmよりもインストールが速く、厳密にモジュールのバージョンを固定できるなど、npmの問題を解決。npmと互換性があり、同じpackage.jsonを使用できます。