Skip to content

Commit f377f1f

Browse files
docs: Update Asset Management guide to ES Modules syntax, and fix package.json formatting
1 parent 51ea1c3 commit f377f1f

File tree

1 file changed

+20
-20
lines changed

1 file changed

+20
-20
lines changed

src/content/guides/asset-management.mdx

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -44,9 +44,9 @@ Let's make a minor change to our project before we get started:
4444
**webpack.config.js**
4545

4646
```diff
47-
const path = require('path');
47+
import path from 'path';
4848

49-
module.exports = {
49+
export default {
5050
entry: './src/index.js',
5151
output: {
5252
- filename: 'main.js',
@@ -67,9 +67,9 @@ npm install --save-dev style-loader css-loader
6767
**webpack.config.js**
6868

6969
```diff
70-
const path = require('path');
70+
import path from 'path';
7171

72-
module.exports = {
72+
export default {
7373
entry: './src/index.js',
7474
output: {
7575
filename: 'bundle.js',
@@ -171,9 +171,9 @@ So now we're pulling in our CSS, but what about our images like backgrounds and
171171
**webpack.config.js**
172172

173173
```diff
174-
const path = require('path');
174+
import path from 'path';
175175

176-
module.exports = {
176+
export default {
177177
entry: './src/index.js',
178178
output: {
179179
filename: 'bundle.js',
@@ -284,9 +284,9 @@ So what about other assets like fonts? The Asset Modules will take any file you
284284
**webpack.config.js**
285285

286286
```diff
287-
const path = require('path');
287+
import path from 'path';
288288

289-
module.exports = {
289+
export default {
290290
entry: './src/index.js',
291291
output: {
292292
filename: 'bundle.js',
@@ -395,9 +395,9 @@ npm install --save-dev csv-loader xml-loader
395395
**webpack.config.js**
396396

397397
```diff
398-
const path = require('path');
398+
import path from 'path';
399399

400-
module.exports = {
400+
export default {
401401
entry: './src/index.js',
402402
output: {
403403
filename: 'bundle.js',
@@ -579,12 +579,12 @@ And configure them in your webpack configuration:
579579
**webpack.config.js**
580580

581581
```diff
582-
const path = require('path');
583-
+const toml = require('toml');
584-
+const yaml = require('yamljs');
585-
+const json5 = require('json5');
582+
import path from 'path';
583+
+import toml from 'toml';
584+
+import yaml from 'yamljs';
585+
+import json5 from 'json5';
586586

587-
module.exports = {
587+
export default {
588588
entry: './src/index.js',
589589
output: {
590590
filename: 'bundle.js',
@@ -732,12 +732,12 @@ For the next guides we won't be using all the different assets we've used in thi
732732
**webpack.config.js**
733733

734734
```diff
735-
const path = require('path');
736-
-const toml = require('toml');
737-
-const yaml = require('yamljs');
738-
-const json5 = require('json5');
735+
import path from 'path';
736+
-import toml from 'toml';
737+
-import yaml from 'yamljs';
738+
-import json5 from 'json5';
739739

740-
module.exports = {
740+
export default {
741741
entry: './src/index.js',
742742
output: {
743743
filename: 'bundle.js',

0 commit comments

Comments
 (0)