質問編集履歴

1

テキスト編集

2018/04/15 14:27

投稿

masaru_free
masaru_free

スコア17

test CHANGED
File without changes
test CHANGED
@@ -9,3 +9,281 @@
9
9
 
10
10
 
11
11
  どうか、宜しくお願い致します。
12
+
13
+
14
+
15
+ 追記
16
+
17
+
18
+
19
+ package.json
20
+
21
+ ```
22
+
23
+ {
24
+
25
+ "name": "zer0",
26
+
27
+ "version": "1.0.0",
28
+
29
+ "description": "",
30
+
31
+ "main": "react.js",
32
+
33
+ "scripts": {
34
+
35
+ "start": "webpack-dev-server --inline",
36
+
37
+ "webpack": "webpack",
38
+
39
+ "w": "webpack -p --watch && NODE_ENV=production webpack config/production/webpack.config.js --progress --colors", "d": "webpack -d --watch"
40
+
41
+ },
42
+
43
+ "keywords": [],
44
+
45
+ "author": "",
46
+
47
+ "license": "MIT",
48
+
49
+ "bugs": {
50
+
51
+ "url": "https://github.com/facebook/react/issues"
52
+
53
+ },
54
+
55
+ "homepage": "https://facebook.github.io/react/",
56
+
57
+ "dependencies": {
58
+
59
+ "babel-core": "^6.26.0",
60
+
61
+ "babel-preset-react-hmre": "^1.1.1",
62
+
63
+ "create-react-class": "^15.6.3",
64
+
65
+ "extract-text-webpack-plugin": "^3.0.1",
66
+
67
+ "gulp-ejs": "^3.1.2",
68
+
69
+ "gulp-postcss": "^7.0.1",
70
+
71
+ "gulp-sass": "^3.1.0",
72
+
73
+ "gulp-uglify": "^3.0.0",
74
+
75
+ "node-sass": "^4.7.2",
76
+
77
+ "postcss-cssnext": "^3.1.0",
78
+
79
+ "react": "^15.6.2",
80
+
81
+ "react-dom": "^15.6.2",
82
+
83
+ "react-redux": "^5.0.7",
84
+
85
+ "redux": "^3.7.2",
86
+
87
+ "sass-loader": "^6.0.6"
88
+
89
+ },
90
+
91
+ "devDependencies": {
92
+
93
+ "@uirouter/react": "^0.6.2",
94
+
95
+ "babel-core": "^6.26.0",
96
+
97
+ "babel-loader": "^7.1.3",
98
+
99
+ "babel-plugin-react-transform": "^3.0.0",
100
+
101
+ "babel-preset-es2015": "^6.24.1",
102
+
103
+ "babel-preset-react": "^6.24.1",
104
+
105
+ "babel-preset-react-hmre": "^1.1.1",
106
+
107
+ "babelify": "^8.0.0",
108
+
109
+ "browserify": "^16.1.0",
110
+
111
+ "css-loader": "^0.28.10",
112
+
113
+ "extract-text-webpack-plugin": "^3.0.2",
114
+
115
+ "file-loader": "^1.1.10",
116
+
117
+ "fs": "0.0.1-security",
118
+
119
+ "gulp": "^3.9.1",
120
+
121
+ "gulp-clean-css": "^3.9.2",
122
+
123
+ "gulp-rename": "^1.2.2",
124
+
125
+ "gulp-sourcemaps": "^2.6.4",
126
+
127
+ "gulp-uglify": "^3.0.0",
128
+
129
+ "gulp-webserver": "^0.9.1",
130
+
131
+ "history": "4.7.2",
132
+
133
+ "jquery": "^3.3.1",
134
+
135
+ "node-sass": "^4.7.2",
136
+
137
+ "page": "^1.8.3",
138
+
139
+ "pdf.js-controller": "^1.0.1",
140
+
141
+ "postcss-easy-import": "^3.0.0",
142
+
143
+ "postcss-loader": "^2.1.1",
144
+
145
+ "react": "^16.2.0",
146
+
147
+ "react-dom": "^16.2.0",
148
+
149
+ "react-event-listener": "^0.5.3",
150
+
151
+ "react-router": "4.2.0",
152
+
153
+ "react-router-dom": "^4.2.2",
154
+
155
+ "react-transform-hmr": "^1.0.4",
156
+
157
+ "sass-loader": "^6.0.6",
158
+
159
+ "style-loader": "^0.20.2",
160
+
161
+ "url-loader": "^0.6.2",
162
+
163
+ "webpack": "^3.11.0",
164
+
165
+ "webpack-cli": "^2.0.14",
166
+
167
+ "webpack-dev-server": "^2.11.1"
168
+
169
+ }
170
+
171
+ }
172
+
173
+ ```
174
+
175
+ webbpack
176
+
177
+ ```
178
+
179
+ var ExtractTextPlugin = require('extract-text-webpack-plugin');
180
+
181
+ var webpack = require('webpack');
182
+
183
+ var path = require('path');
184
+
185
+
186
+
187
+ module.exports = {
188
+
189
+ context: path.join(__dirname, 'assets/js'),
190
+
191
+ entry: {
192
+
193
+ react: './react.jsx'//ここを増やす
194
+
195
+ },
196
+
197
+ output: {
198
+
199
+ path: path.join(__dirname, 'public/js/react'),
200
+
201
+ filename: 'react.js'
202
+
203
+ },
204
+
205
+ module: {
206
+
207
+ rules: [
208
+
209
+ {
210
+
211
+ test: /.(js|jsx)$/,
212
+
213
+ exclude: /node_modules/,
214
+
215
+ loader: 'babel-loader',
216
+
217
+ query: {
218
+
219
+ presets: ['react', 'es2015', 'react-hmre']
220
+
221
+ },
222
+
223
+ }
224
+
225
+ ],
226
+
227
+ },
228
+
229
+ devServer: {
230
+
231
+ port:8888,
232
+
233
+ inline: true
234
+
235
+ },
236
+
237
+ };
238
+
239
+
240
+
241
+ ```
242
+
243
+ reactの記載内容です。
244
+
245
+ ```
246
+
247
+ import React, { Component } from 'react';
248
+
249
+ import ReactDOM from 'react-dom';
250
+
251
+
252
+
253
+
254
+
255
+ class App extends Component {
256
+
257
+ render() {
258
+
259
+ return (
260
+
261
+ <div className="test">
262
+
263
+ <p>test</p>
264
+
265
+ </div>
266
+
267
+ );
268
+
269
+ }
270
+
271
+ }
272
+
273
+
274
+
275
+ ReactDOM.render(
276
+
277
+ <App />,
278
+
279
+ document.getElementById('content')
280
+
281
+ );
282
+
283
+
284
+
285
+ ```
286
+
287
+ 上記が開発時使用していますファイルになります。
288
+
289
+ 長々となってしまいましたが、宜しくお願いいたします。