🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

MVC

MVC(Model View Controller)は、オブジェクト指向プログラミングにおけるモデル・ビュー・コントローラーの総称であり、ソフトフェア開発で使われている構築パターンとしても呼ばれます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Q&A

解決済

1回答

7470閲覧

Laravel エラーについて(The Mix manifest does not exist. )

hiroki88

総合スコア66

Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

MVC

MVC(Model View Controller)は、オブジェクト指向プログラミングにおけるモデル・ビュー・コントローラーの総称であり、ソフトフェア開発で使われている構築パターンとしても呼ばれます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

0グッド

0クリップ

投稿2019/09/09 09:56

編集2019/09/12 16:42

Laravel初心者です。
構築にあたってLaravelMixも導入して行おうと思っております。
ただ進めていった時にこのようなエラーがでてしまいました。
確認していくうちに

<script src="<?php echo e(mix('js/app.js')); ?>" defer></script> <link href="{{ mix('css/app.css') }}" rel="stylesheet"> の2つのコードがエラーの原因なんだとは理解できました。

ただじゃあこれをどうしたらいいのかが分からず色々調べてみましたが分かりませんでした。
もし解決方法がわかる方がいたらご教授して頂けると助かります。
![イメージ説明]

環境構築を行ったやり方
1【Laravelのインストール】
パソコン : Windows10を使用
ローカル環境 : MAMPを使用(MAMPに関してはwindows版を使用しています)
構築後はhttp://localhost:8000/にアクセスしLaravelと書かれたデフォルトの
ページを表示できました。
主に下記の3つのサイトを使用しLaravelの構築を行いました。

https://codeforfun.jp/how-to-install-composer-for-windows/
https://qiita.com/PKunito/items/6a3bb187ca3c67de4519
https://breezegroup.co.jp/201904/windows-laravel/

2【Node.jsのインストール】
バージョンはv10.16.3でした。
npmについてはバージョンが6.9.0でした。
下記のサイトを参考にNode.jsをインストールしました。

https://qiita.com/taiponrock/items/9001ae194571feb63a5e

3【package.jsonのインストール】
インストール先は作成したLaravelフォルダ直下になります。
Laravel-app
---------bootstrap
---------config
---------database
---------public
---------resources
---------routes
---------storage
---------tests
---------vender
---------package.json

package.jsonの中身のソースコード↓

{ "private": true, "scripts": { "dev": "npm run development", "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", "watch": "npm run development -- --watch", "watch-poll": "npm run watch -- --watch-poll", "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js", "prod": "npm run production", "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js" }, "devDependencies": { "axios": "^0.18", "browser-sync": "^2.26.3", "browser-sync-webpack-plugin": "2.0.1", "cross-env": "^5.1", "laravel-mix": "^4.0.7", "resolve-url-loader": "^2.3.1", "sass": "^1.15.2", "sass-loader": "^7.1.0", "vue": "^2.5.17", "resolve-url-loader":"^2.3.1", "vue-template-compiler": "^2.5.21" } }

4【LaravelMixのインストール】
インストール先は作成したLaravelフォルダ直下になります。
Laravel-app
---------bootstrap
---------config
---------database
---------public
---------resources
---------routes
---------storage
---------tests
---------vender
---------package.json
---------webpack.mix

webpack.mixの中身のソースコード↓

const mix = require('laravel-mix'); mix.browserSync('laravel.test') .js('resources/js/app.js', 'public/js') .sass('resources/sass/app.scss', 'public/css') .version() .browserSync('my-domain.dev')

またnpm run devに関してもエラーがでており実行できていません。

errorcode

1C:\MAMP\htdocs\laravel>npm run dev 2npm ERR! file C:\MAMP\htdocs\laravel\package.json 3npm ERR! code EJSONPARSE 4npm ERR! JSON.parse Failed to parse json 5npm ERR! JSON.parse Unexpected token / in JSON at position 767 while parsing near '...nfig.js" 6npm ERR! JSON.parse }, 7npm ERR! JSON.parse /*"devDependencies":...' 8npm ERR! JSON.parse Failed to parse package.json data. 9npm ERR! JSON.parse package.json must be actual JSON, not just JavaScript. 10 11npm ERR! A complete log of this run can be found in: 12npm ERR! C:\Users\user\AppData\Roaming\npm-cache\_logs\2019-09-11T16_24_45_632Z-debug.log

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

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

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

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

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

m.ts10806

2019/09/10 01:22

>進めていった時に どのように進めていったのでしょうか。提示内容から分かるのはエラーメッセージそのままで「何か設定や準備が足りてない」くらいです。 参考にした記事など出典を質問本文に提示してください。
hiroki88

2019/09/10 15:20

ご指摘ありがとうございます。 より詳細に書き直しましたのでご確認よろしくお願いいたします。
mix-peach

2019/09/12 06:35

Laravelフォルダって、 C:\MAMP\htdocs\Laravel こう設置されていて、この直下にlaravelの.envファイル、package.json、webpack.mixが置いてある・・っていう認識で合ってますか? もしそうなら、npm run dev 等のコマンドは、C:\MAMP\htdocs\Laravel の直下で実行すべきなのでは・・?
hiroki88

2019/09/12 16:44

ご指摘ありがとうございます。C:\MAMP\htdocs\Laravelの直下でnpm run dev で 行ったところこちらでもエラーがでてしまいました。 一応エラー文を載せましたがまだ解決方法が見つかっておりません。
mix-peach

2019/09/13 01:05

JSONのパースエラー・・package.jsonの中身って、質問に提示した内容と本当に同じです??
mix-peach

2019/09/17 00:43

エラーメッセージは、コマンドプロンプト等のコピペですよね?メッセージを見る限り、 /*"devDependencies":...' ↑この先頭の /* がパースエラーの原因だと思うんですが、C:\MAMP\htdocs\Laravelpackage.jsonには、この記述はないのでしょうか? エラーメッセージを正とするなら、hiroki88さんの確認したpackage.jsonファイルは、確認すべきファイルとは違うものでは?・・とか、そういう推測になるのですが・・。
guest

回答1

0

ベストアンサー

以下のコマンドを試してみてはいかがでしょうか

npm install npm run dev

投稿2019/09/20 12:09

編集2019/09/20 12:12
kokemomo.sour

総合スコア330

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

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

hiroki88

2019/09/25 13:50

再度node.jsをインストールして上記のコマンドを入力したら実行できました。 正直何がだめだったのかいくら調べても分からなかったので最初からやり直しました。 ありがとうございます!
kokemomo.sour

2019/09/29 05:02

解決されたようでよかったです。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.36%

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

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

質問する

関連した質問