質問するログイン新規登録

質問編集履歴

2

間違えていたため

2019/09/12 16:42

投稿

hiroki88
hiroki88

スコア66

title CHANGED
File without changes
body CHANGED
@@ -101,17 +101,18 @@
101
101
  .browserSync('my-domain.dev')
102
102
  ```
103
103
 
104
- **またnpm run dev,npm run watchに関してもエラーがでており実行できていません。**
104
+ **またnpm run devに関してもエラーがでており実行できていません。**
105
105
  ```errorcode
106
- C:\MAMP\htdocs>npm run watch
106
+ C:\MAMP\htdocs\laravel>npm run dev
107
+ npm ERR! file C:\MAMP\htdocs\laravel\package.json
108
+ npm ERR! code EJSONPARSE
109
+ npm ERR! JSON.parse Failed to parse json
110
+ npm ERR! JSON.parse Unexpected token / in JSON at position 767 while parsing near '...nfig.js"
107
- npm ERR! missing script: watch
111
+ npm ERR! JSON.parse },
112
+ npm ERR! JSON.parse /*"devDependencies":...'
113
+ npm ERR! JSON.parse Failed to parse package.json data.
114
+ npm ERR! JSON.parse package.json must be actual JSON, not just JavaScript.
108
115
 
109
116
  npm ERR! A complete log of this run can be found in:
110
- npm ERR! C:\Users\user\AppData\Roaming\npm-cache\_logs\2019-09-05T16_08_38_768Z-debug.log
111
-
112
- C:\MAMP\htdocs>npm run dev
113
- npm ERR! missing script: dev
114
-
115
- npm ERR! A complete log of this run can be found in:
116
- npm ERR! C:\Users\user\AppData\Roaming\npm-cache\_logs\2019-09-05T16_08_41_599Z-debug.log
117
+ npm ERR! C:\Users\user\AppData\Roaming\npm-cache\_logs\2019-09-11T16_24_45_632Z-debug.log
117
118
  ```

1

具体的になにがだめか詳細に書きました。

2019/09/12 16:42

投稿

hiroki88
hiroki88

スコア66

title CHANGED
File without changes
body CHANGED
@@ -8,4 +8,110 @@
8
8
 
9
9
  ただじゃあこれをどうしたらいいのかが分からず色々調べてみましたが分かりませんでした。
10
10
  もし解決方法がわかる方がいたらご教授して頂けると助かります。
11
- ![![イメージ説明](a4b83197dc24010c36ac68aeaf7f02a8.jpeg)](c1a269fe79a9269d419d543e26d68b0c.jpeg)
11
+ ![![イメージ説明](a4b83197dc24010c36ac68aeaf7f02a8.jpeg)]
12
+
13
+ 環境構築を行ったやり方
14
+ **1【Laravelのインストール】**
15
+ パソコン : Windows10を使用
16
+ ローカル環境 : MAMPを使用(MAMPに関してはwindows版を使用しています)
17
+ 構築後はhttp://localhost:8000/にアクセスしLaravelと書かれたデフォルトの
18
+ ページを表示できました。
19
+ 主に下記の3つのサイトを使用しLaravelの構築を行いました。
20
+
21
+ https://codeforfun.jp/how-to-install-composer-for-windows/
22
+ https://qiita.com/PKunito/items/6a3bb187ca3c67de4519
23
+ https://breezegroup.co.jp/201904/windows-laravel/
24
+
25
+ **2【Node.jsのインストール】**
26
+ バージョンはv10.16.3でした。
27
+ npmについてはバージョンが6.9.0でした。
28
+ 下記のサイトを参考にNode.jsをインストールしました。
29
+
30
+ https://qiita.com/taiponrock/items/9001ae194571feb63a5e
31
+
32
+ **3【package.jsonのインストール】**
33
+ インストール先は作成したLaravelフォルダ直下になります。
34
+ Laravel-app
35
+ ---------bootstrap
36
+ ---------config
37
+ ---------database
38
+ ---------public
39
+ ---------resources
40
+ ---------routes
41
+ ---------storage
42
+ ---------tests
43
+ ---------vender
44
+ ---------**package.json**
45
+
46
+ package.jsonの中身のソースコード↓
47
+ ```
48
+ {
49
+ "private": true,
50
+ "scripts": {
51
+ "dev": "npm run development",
52
+ "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
53
+ "watch": "npm run development -- --watch",
54
+ "watch-poll": "npm run watch -- --watch-poll",
55
+ "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",
56
+ "prod": "npm run production",
57
+ "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"
58
+ },
59
+
60
+ "devDependencies": {
61
+ "axios": "^0.18",
62
+ "browser-sync": "^2.26.3",
63
+ "browser-sync-webpack-plugin": "2.0.1",
64
+ "cross-env": "^5.1",
65
+ "laravel-mix": "^4.0.7",
66
+ "resolve-url-loader": "^2.3.1",
67
+ "sass": "^1.15.2",
68
+ "sass-loader": "^7.1.0",
69
+ "vue": "^2.5.17",
70
+ "resolve-url-loader":"^2.3.1",
71
+ "vue-template-compiler": "^2.5.21"
72
+ }
73
+
74
+ }
75
+
76
+ ```
77
+
78
+ **4【LaravelMixのインストール】**
79
+ インストール先は作成したLaravelフォルダ直下になります。
80
+ Laravel-app
81
+ ---------bootstrap
82
+ ---------config
83
+ ---------database
84
+ ---------public
85
+ ---------resources
86
+ ---------routes
87
+ ---------storage
88
+ ---------tests
89
+ ---------vender
90
+ ---------package.json
91
+ ---------**webpack.mix**
92
+
93
+ webpack.mixの中身のソースコード↓
94
+ ```
95
+ const mix = require('laravel-mix');
96
+
97
+ mix.browserSync('laravel.test')
98
+ .js('resources/js/app.js', 'public/js')
99
+ .sass('resources/sass/app.scss', 'public/css')
100
+ .version()
101
+ .browserSync('my-domain.dev')
102
+ ```
103
+
104
+ **またnpm run dev,npm run watchに関してもエラーがでており実行できていません。**
105
+ ```errorcode
106
+ C:\MAMP\htdocs>npm run watch
107
+ npm ERR! missing script: watch
108
+
109
+ npm ERR! A complete log of this run can be found in:
110
+ npm ERR! C:\Users\user\AppData\Roaming\npm-cache\_logs\2019-09-05T16_08_38_768Z-debug.log
111
+
112
+ C:\MAMP\htdocs>npm run dev
113
+ npm ERR! missing script: dev
114
+
115
+ npm ERR! A complete log of this run can be found in:
116
+ npm ERR! C:\Users\user\AppData\Roaming\npm-cache\_logs\2019-09-05T16_08_41_599Z-debug.log
117
+ ```