vue-server-rendererをwebpackするとエラー
受付中
回答 0
投稿
- 評価
- クリップ 1
- VIEW 1,334
Vue.jsのSSRを試そうとして、vue-server-rendererをwebpackでビルドしたのですが以下のエラーが出てしまいます。解決方法を教えてください。
- インストール
npm install webpack --save-dev
npm install vue --save
npm install vue-server-renderer --save
npm install webpack -g
- webpack.config.js
module.exports = {
entry: './src/main.js',
output: {
path: "./build",
filename: 'build.js'
}
}
- src/main.js
var renderer = require('vue-server-renderer');
console.log(renderer);
- エラー内容
$ webpack
Hash: b780c6234145a9bea83b
Version: webpack 1.14.0
Time: 973ms
Asset Size Chunks Chunk Names
build.js 597 kB 0 [emitted] main
[0] ./src/main.js 70 bytes {0} [built]
+ 39 hidden modules
WARNING in ./~/vue-server-renderer/build.js
Critical dependencies:
6346:47-54 require function is used in a way in which dependencies cannot be statically extracted
@ ./~/vue-server-renderer/build.js 6346:47-54
WARNING in ./~/vue-server-renderer/README.md
Module parse failed: /Users/takezaki/temp/vue/node_modules/vue-server-renderer/README.md Unexpected character '#' (1:0)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected character '#' (1:0)
at Parser.pp$4.raise (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:2221:15)
at Parser.pp$7.getTokenFromCode (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:2756:10)
at Parser.pp$7.readToken (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:2477:17)
at Parser.pp$7.nextToken (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:2468:15)
at Parser.parse (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:515:10)
at Object.parse (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:3098:39)
at Parser.parse (/Users/takezaki/temp/vue/node_modules/webpack/lib/Parser.js:902:15)
at DependenciesBlock.<anonymous> (/Users/takezaki/temp/vue/node_modules/webpack/lib/NormalModule.js:104:16)
at DependenciesBlock.onModuleBuild (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/webpack-core/lib/NormalModuleMixin.js:310:10)
at nextLoader (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/webpack-core/lib/NormalModuleMixin.js:275:25)
at /Users/takezaki/temp/vue/node_modules/webpack/node_modules/webpack-core/lib/NormalModuleMixin.js:259:5
at Storage.finished (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:38:16)
at /Users/takezaki/temp/vue/node_modules/webpack/node_modules/enhanced-resolve/node_modules/graceful-fs/graceful-fs.js:78:16
at fs.js:334:14
at /Users/takezaki/temp/vue/node_modules/webpack/node_modules/enhanced-resolve/node_modules/graceful-fs/graceful-fs.js:43:10
at FSReqWrap.oncomplete (fs.js:95:15)
@ ./~/vue-server-renderer ^\.\/.*$
ERROR in ./~/vue-server-renderer/package.json
Module parse failed: /Users/takezaki/temp/vue/node_modules/vue-server-renderer/package.json Unexpected token (2:8)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (2:8)
at Parser.pp$4.raise (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:2221:15)
at Parser.pp.unexpected (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:603:10)
at Parser.pp.semicolon (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:581:61)
at Parser.pp$1.parseExpressionStatement (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:966:10)
at Parser.pp$1.parseStatement (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:730:24)
at Parser.pp$1.parseBlock (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:981:25)
at Parser.pp$1.parseStatement (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:709:33)
at Parser.pp$1.parseTopLevel (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:638:25)
at Parser.parse (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:516:17)
at Object.parse (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/acorn/dist/acorn.js:3098:39)
at Parser.parse (/Users/takezaki/temp/vue/node_modules/webpack/lib/Parser.js:902:15)
at DependenciesBlock.<anonymous> (/Users/takezaki/temp/vue/node_modules/webpack/lib/NormalModule.js:104:16)
at DependenciesBlock.onModuleBuild (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/webpack-core/lib/NormalModuleMixin.js:310:10)
at nextLoader (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/webpack-core/lib/NormalModuleMixin.js:275:25)
at /Users/takezaki/temp/vue/node_modules/webpack/node_modules/webpack-core/lib/NormalModuleMixin.js:259:5
at Storage.provide (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:52:20)
at CachedInputFileSystem.readFile (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:140:24)
at DependenciesBlock.onLoadPitchDone (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/webpack-core/lib/NormalModuleMixin.js:255:7)
at DependenciesBlock.loadPitch (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/webpack-core/lib/NormalModuleMixin.js:182:27)
at DependenciesBlock.doBuild (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/webpack-core/lib/NormalModuleMixin.js:241:4)
at DependenciesBlock.build (/Users/takezaki/temp/vue/node_modules/webpack/lib/NormalModule.js:84:14)
at Compilation.buildModule (/Users/takezaki/temp/vue/node_modules/webpack/lib/Compilation.js:126:9)
at /Users/takezaki/temp/vue/node_modules/webpack/lib/Compilation.js:309:10
at /Users/takezaki/temp/vue/node_modules/webpack/lib/NormalModuleFactory.js:58:13
at NormalModuleFactory.applyPluginsAsyncWaterfall (/Users/takezaki/temp/vue/node_modules/webpack/node_modules/tapable/lib/Tapable.js:75:69)
at onDoneResolving (/Users/takezaki/temp/vue/node_modules/webpack/lib/NormalModuleFactory.js:38:11)
at onDoneResolving (/Users/takezaki/temp/vue/node_modules/webpack/lib/NormalModuleFactory.js:121:6)
at /Users/takezaki/temp/vue/node_modules/webpack/lib/NormalModuleFactory.js:116:7
at /Users/takezaki/temp/vue/node_modules/webpack/node_modules/async/lib/async.js:726:13
at /Users/takezaki/temp/vue/node_modules/webpack/node_modules/async/lib/async.js:52:16
@ ./~/vue-server-renderer/index.js 5:18-43 6:21-46
ERROR in ./~/vue-server-renderer/build.js
Module not found: Error: Cannot resolve module 'module' in /Users/takezaki/temp/vue/node_modules/vue-server-renderer
@ ./~/vue-server-renderer/build.js 10:35-52
-
気になる質問をクリップする
クリップした質問は、後からいつでもマイページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
クリップを取り消します
-
良い質問の評価を上げる
以下のような質問は評価を上げましょう
- 質問内容が明確
- 自分も答えを知りたい
- 質問者以外のユーザにも役立つ
評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。
質問の評価を上げたことを取り消します
-
評価を下げられる数の上限に達しました
評価を下げることができません
- 1日5回まで評価を下げられます
- 1日に1ユーザに対して2回まで評価を下げられます
質問の評価を下げる
teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。
- プログラミングに関係のない質問
- やってほしいことだけを記載した丸投げの質問
- 問題・課題が含まれていない質問
- 意図的に内容が抹消された質問
- 過去に投稿した質問と同じ内容の質問
- 広告と受け取られるような投稿
評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。
質問の評価を下げたことを取り消します
この機能は開放されていません
評価を下げる条件を満たしてません
質問の評価を下げる機能の利用条件
この機能を利用するためには、以下の事項を行う必要があります。
- 質問回答など一定の行動
-
メールアドレスの認証
メールアドレスの認証
-
質問評価に関するヘルプページの閲覧
質問評価に関するヘルプページの閲覧
まだ回答がついていません
15分調べてもわからないことは、teratailで質問しよう!
- ただいまの回答率 88.09%
- 質問をまとめることで、思考を整理して素早く解決
- テンプレート機能で、簡単に質問をまとめられる