回答編集履歴
2
文章を整理しました
test
CHANGED
@@ -4,11 +4,17 @@
|
|
4
4
|
|
5
5
|
|
6
6
|
|
7
|
-
ESModules の `import` / `export ` と CommonJS の `module.exports` / `require` が混在するとエラーが発生しがちなので、揃えてあげるのが良さそうに思います。
|
7
|
+
ESModules の `import` / `export ` と CommonJS の `module.exports` / `require` が混在するとwebpackで解釈ができずにエラーが発生しがちなので、揃えてあげるのが良さそうに思います。
|
8
|
+
|
9
|
+
|
10
|
+
|
8
|
-
|
11
|
+
> You can mix `require` and `export`. You can't mix `import` and `module.exports`.
|
12
|
+
|
9
|
-
|
13
|
+
> [Cannot assign to read only property 'exports' of object '#<Object>' (mix require and export) #4039](https://github.com/webpack/webpack/issues/4039#issuecomment-273804003)
|
10
|
-
|
14
|
+
|
15
|
+
|
16
|
+
|
11
|
-
`sample.js` で読み込んだモジュールを `...` で複製した
|
17
|
+
ただ本件は混在してないにもかかわらずこのエラーが発生しているようで、原因はちょっと分からないのですが `sample.js` で読み込んだモジュールを `...` で複製したものを `module.exports` しているのが鬼門になっている。
|
12
18
|
|
13
19
|
|
14
20
|
|
@@ -44,6 +50,40 @@
|
|
44
50
|
|
45
51
|
|
46
52
|
|
53
|
+
スプレッド演算子で複製しなければ問題なく動作するので…
|
54
|
+
|
55
|
+
|
56
|
+
|
57
|
+
```js
|
58
|
+
|
59
|
+
const hoge = require('./hoge');
|
60
|
+
|
61
|
+
const sample = {hoge};
|
62
|
+
|
63
|
+
module.exports = sample;
|
64
|
+
|
65
|
+
|
66
|
+
|
67
|
+
// import.ts
|
68
|
+
|
69
|
+
const sample = require('./sample');
|
70
|
+
|
71
|
+
=> ????
|
72
|
+
|
73
|
+
|
74
|
+
|
75
|
+
// import.ts
|
76
|
+
|
77
|
+
import sample from './sample';
|
78
|
+
|
79
|
+
=> ????
|
80
|
+
|
81
|
+
```
|
82
|
+
|
83
|
+
|
84
|
+
|
85
|
+
|
86
|
+
|
47
87
|
`sample.js` を `export default` にすればうまく動作するかと思います
|
48
88
|
|
49
89
|
|
@@ -114,13 +154,55 @@
|
|
114
154
|
|
115
155
|
|
116
156
|
|
157
|
+
---
|
158
|
+
|
159
|
+
|
160
|
+
|
117
|
-
|
161
|
+
※ 同じファイルで `import` したものを `module.exports` するとすべからく下記のエラーが発生します。
|
162
|
+
|
118
|
-
|
163
|
+
```
|
164
|
+
|
119
|
-
|
165
|
+
Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>'
|
166
|
+
|
120
|
-
|
167
|
+
```
|
168
|
+
|
169
|
+
|
170
|
+
|
121
|
-
```js
|
171
|
+
```js
|
172
|
+
|
122
|
-
|
173
|
+
// sample.js
|
174
|
+
|
175
|
+
import hoge from './hoge';
|
176
|
+
|
177
|
+
const sample = {...hoge};
|
178
|
+
|
179
|
+
module.exports = sample;
|
180
|
+
|
181
|
+
|
182
|
+
|
183
|
+
// import.ts
|
184
|
+
|
185
|
+
import sample from './sample';
|
186
|
+
|
187
|
+
=> ????♀️
|
188
|
+
|
189
|
+
|
190
|
+
|
191
|
+
// import.ts
|
192
|
+
|
123
|
-
const
|
193
|
+
const sample = require('./sample');
|
194
|
+
|
195
|
+
=> ????♀️
|
196
|
+
|
197
|
+
```
|
198
|
+
|
199
|
+
|
200
|
+
|
201
|
+
```js
|
202
|
+
|
203
|
+
// sample.js
|
204
|
+
|
205
|
+
import hoge from './hoge';
|
124
206
|
|
125
207
|
const sample = {hoge};
|
126
208
|
|
@@ -130,78 +212,6 @@
|
|
130
212
|
|
131
213
|
// import.ts
|
132
214
|
|
133
|
-
const sample = require('./sample');
|
134
|
-
|
135
|
-
=> ????
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
// import.ts
|
140
|
-
|
141
|
-
import sample from './sample';
|
142
|
-
|
143
|
-
=> ????
|
144
|
-
|
145
|
-
```
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
|
150
|
-
|
151
|
-
※ 同じファイルで `import` したものを `module.exports` するとすべからく下記のエラーが発生します。
|
152
|
-
|
153
|
-
```
|
154
|
-
|
155
|
-
Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>'
|
156
|
-
|
157
|
-
```
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
```js
|
162
|
-
|
163
|
-
// sample.js
|
164
|
-
|
165
|
-
import hoge from './hoge';
|
166
|
-
|
167
|
-
const sample = {...hoge};
|
168
|
-
|
169
|
-
module.exports = sample;
|
170
|
-
|
171
|
-
|
172
|
-
|
173
|
-
// import.ts
|
174
|
-
|
175
|
-
import sample from './sample';
|
176
|
-
|
177
|
-
=> ????♀️
|
178
|
-
|
179
|
-
|
180
|
-
|
181
|
-
// import.ts
|
182
|
-
|
183
|
-
const sample = require('./sample');
|
184
|
-
|
185
|
-
=> ????♀️
|
186
|
-
|
187
|
-
```
|
188
|
-
|
189
|
-
|
190
|
-
|
191
|
-
```js
|
192
|
-
|
193
|
-
// sample.js
|
194
|
-
|
195
|
-
import hoge from './hoge';
|
196
|
-
|
197
|
-
const sample = {hoge};
|
198
|
-
|
199
|
-
module.exports = sample;
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
// import.ts
|
204
|
-
|
205
215
|
import sample from './sample';
|
206
216
|
|
207
217
|
=> ????♀️
|
@@ -220,6 +230,8 @@
|
|
220
230
|
|
221
231
|
cf.
|
222
232
|
|
233
|
+
[https://github.com/webpack/webpack/issues/4039](https://github.com/webpack/webpack/issues/4039)
|
234
|
+
|
223
235
|
[https://chaika.hatenablog.com/entry/2019/02/04/083000](https://chaika.hatenablog.com/entry/2019/02/04/083000)
|
224
236
|
|
225
237
|
[https://tech-1natsu.hatenablog.com/entry/2017/10/21/142210](https://tech-1natsu.hatenablog.com/entry/2017/10/21/142210)
|
1
参考サイト追加
test
CHANGED
@@ -215,3 +215,11 @@
|
|
215
215
|
=> ????♀️
|
216
216
|
|
217
217
|
```
|
218
|
+
|
219
|
+
|
220
|
+
|
221
|
+
cf.
|
222
|
+
|
223
|
+
[https://chaika.hatenablog.com/entry/2019/02/04/083000](https://chaika.hatenablog.com/entry/2019/02/04/083000)
|
224
|
+
|
225
|
+
[https://tech-1natsu.hatenablog.com/entry/2017/10/21/142210](https://tech-1natsu.hatenablog.com/entry/2017/10/21/142210)
|