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

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

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

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

Yarn

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

Q&A

0回答

4873閲覧

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

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クリップ

投稿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は問題ない挙動だそうです。

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

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

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

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

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問