Skip to content

Commit 36276c0

Browse files
toastalkazupon
authored andcommitted
1 parent ce73905 commit 36276c0

File tree

21 files changed

+41
-41
lines changed

21 files changed

+41
-41
lines changed

โ€Ždocs/en/README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
There are many cool features provided by `vue-loader`:
1010

1111
- ES2015 enabled by default;
12-
- Allows using other webpack loaders for each part of a Vue component, for example SASS for `<style>` and Jade for `<template>`;
12+
- Allows using other webpack loaders for each part of a Vue component, for example Sass for `<style>` and Jade for `<template>`;
1313
- Allows custom sections in a .vue file that can have custom loader chains applied to them
1414
- Treat static assets referenced in `<style>` and `<template>` as module dependencies and handle them with webpack loaders;
1515
- Can simulate scoped CSS for each component;
@@ -32,7 +32,7 @@ But webpack can do more than that. With "loaders", we can teach webpack to trans
3232
- Transpile ES2015, CoffeeScript or TypeScript modules into plain ES5 CommonJS modules;
3333
- Optionally you can pipe the source code through a linter before doing the compilation;
3434
- Transpile Jade templates into plain HTML and inline it as a JavaScript string;
35-
- Transpile SASS files into plain CSS, then convert it into a JavaScript snippet that insert the resulting CSS as a `<style>` tag;
35+
- Transpile Sass files into plain CSS, then convert it into a JavaScript snippet that insert the resulting CSS as a `<style>` tag;
3636
- Process an image file referenced in HTML or CSS, moved it to the desired destination based on the path configurations, and naming it using its md5 hash.
3737

3838
webpack is so powerful that when you understand how it works, it can dramatically improve your front-end workflow. Its primary drawback is its verbose and complex configuration; but with this guide you should be able to find solutions for most common issues when using webpack with Vue.js and `vue-loader`.

โ€Ždocs/en/configurations/pre-processors.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ In webpack, all pre-processors need to be applied with a corresponding loader. `
44

55
### CSS
66

7-
For example, let's compile our `<style>` tag with SASS:
7+
For example, let's compile our `<style>` tag with Sass:
88

99
``` bash
1010
npm install sass-loader node-sass --save-dev
@@ -20,7 +20,7 @@ Under the hood, the text content inside the `<style>` tag will be first compiled
2020

2121
#### sass-loader caveat
2222

23-
Contrary to what its name indicates, [*sass*-loader](https://github.com/jtangelder/sass-loader) parses *SCSS* syntax by default. If you actually want to use the indented *SASS* syntax, you have to configure vue-loader's options for sass-loader accordingly.
23+
Contrary to what its name indicates, [*sass*-loader](https://github.com/jtangelder/sass-loader) parses *SCSS* syntax by default. If you actually want to use the indented *Sass* syntax, you have to configure vue-loader's options for sass-loader accordingly.
2424

2525
```javascript
2626
{

โ€Ždocs/en/features/scoped-css.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ The above will be compiled into:
6464
.a[data-v-f3f3eg9] .b { /* ... */ }
6565
```
6666

67-
Some pre-processors, such as SASS, may not be able to parse `>>>` properly. In those cases you can use the `/deep/` combinator instead - it's an alias for `>>>` and works exactly the same.
67+
Some pre-processors, such as Sass, may not be able to parse `>>>` properly. In those cases you can use the `/deep/` combinator instead - it's an alias for `>>>` and works exactly the same.
6868

6969
### Dynamically Generated Content
7070

โ€Ždocs/en/start/spec.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,11 +30,11 @@ export default {
3030

3131
`vue-loader` will parse the file, extract each language block, pipe them through other loaders if necessary, and finally assemble them back into a CommonJS module whose `module.exports` is a Vue.js component options object.
3232

33-
`vue-loader` supports using non-default languages, such as CSS pre-processors and compile-to-HTML template languages, by specifying the `lang` attribute for a language block. For example, you can use SASS for the style of your component like this:
33+
`vue-loader` supports using non-default languages, such as CSS pre-processors and compile-to-HTML template languages, by specifying the `lang` attribute for a language block. For example, you can use Sass for the style of your component like this:
3434

3535
``` html
3636
<style lang="sass">
37-
/* write SASS! */
37+
/* write Sass! */
3838
</style>
3939
```
4040

โ€Ždocs/ja/README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
`vue-loader` ใซใ‚ˆใฃใฆๅคšใใฎใ‚ฏใƒผใƒซใชๆฉŸ่ƒฝใŒๆไพ›ใ•ใ‚Œใพใ™:
1010

1111
- ใƒ‡ใƒ•ใ‚ฉใƒซใƒˆใง ES2015 ใŒๆœ‰ๅŠน
12-
- `<style>` ใซใฏ SASSใ€ `<template>` ใซใฏ Jade ใชใฉใ€Vue ใ‚ณใƒณใƒใƒผใƒใƒณใƒˆใฎๅ„ใƒ‘ใƒผใƒ„ใซไป–ใฎ webpack ใฎ loader ใŒไฝฟ็”จๅฏ่ƒฝใ€ใ‚ซใ‚นใ‚ฟใƒ  loader ใƒใ‚งใƒผใƒณใ‚’้ฉ็”จใงใใ‚‹ .vue ใƒ•ใ‚กใ‚คใƒซใฎใ‚ซใ‚นใ‚ฟใƒ ใ‚ปใ‚ฏใ‚ทใƒงใƒณใ‚’่ฟฝๅŠ ๅฏ่ƒฝ
12+
- `<style>` ใซใฏ Sassใ€ `<template>` ใซใฏ Jade ใชใฉใ€Vue ใ‚ณใƒณใƒใƒผใƒใƒณใƒˆใฎๅ„ใƒ‘ใƒผใƒ„ใซไป–ใฎ webpack ใฎ loader ใŒไฝฟ็”จๅฏ่ƒฝใ€ใ‚ซใ‚นใ‚ฟใƒ  loader ใƒใ‚งใƒผใƒณใ‚’้ฉ็”จใงใใ‚‹ .vue ใƒ•ใ‚กใ‚คใƒซใฎใ‚ซใ‚นใ‚ฟใƒ ใ‚ปใ‚ฏใ‚ทใƒงใƒณใ‚’่ฟฝๅŠ ๅฏ่ƒฝ
1313
- `<style>` ใจ `<template>` ใงๅ‚็…งใ•ใ‚Œใ‚‹้™็š„ใชใ‚ขใ‚ปใƒƒใƒˆใ‚’ใƒขใ‚ธใƒฅใƒผใƒซใฎไพๅญ˜ใจใ—ใฆๆ‰ฑใ„ใ€webpack ใฎ loader ใงๅ‡ฆ็†ๅฏ่ƒฝ
1414
- ๅ„ใ‚ณใƒณใƒใƒผใƒใƒณใƒˆใง scoped CSS ใ‚’ใ‚ทใƒŸใƒฅใƒฌใƒผใƒˆใ™ใ‚‹ใ“ใจใŒๅฏ่ƒฝ
1515
- ้–‹็™บๆ™‚ใฎใ‚ณใƒณใƒใƒผใƒใƒณใƒˆใฎใƒ›ใƒƒใƒˆใƒชใƒญใƒผใƒ‰ใ‚’ใ‚ตใƒใƒผใƒˆ
@@ -31,7 +31,7 @@
3131
- ES2015ใ€CoffeeScriptใ€TypeScript ใฎใƒขใ‚ธใƒฅใƒผใƒซใ‚’ใƒ—ใƒฌใƒผใƒณใช ES5 ใฎ CommonJS ใƒขใ‚ธใƒฅใƒผใƒซใซใƒˆใƒฉใƒณใ‚นใƒ‘ใ‚คใƒซ
3232
- ใ‚ชใƒ—ใ‚ทใƒงใƒณใงใ‚ณใƒณใƒ‘ใ‚คใƒซใ‚’่กŒใ†ๅ‰ใซใ‚ฝใƒผใ‚นใ‚ณใƒผใƒ‰ใ‚’ linter ใซ้€šใ™ใ“ใจใŒๅฏ่ƒฝ
3333
- Jade ใƒ†ใƒณใƒ—ใƒฌใƒผใƒˆใ‚’ใƒ—ใƒฌใƒผใƒณใช HTML ใซใƒˆใƒฉใƒณใ‚นใƒ‘ใ‚คใƒซใ—ใ€JavaScript ใฎๆ–‡ๅญ—ๅˆ—ใจใ—ใฆๅฑ•้–‹
34-
- SASS ใƒ•ใ‚กใ‚คใƒซใ‚’ใƒ—ใƒฌใƒผใƒณใช CSS ใซใƒˆใƒฉใƒณใ‚นใƒ‘ใ‚คใƒซใ—ใ€`<style>` ใ‚ฟใ‚ฐใจใ—ใฆๆŒฟๅ…ฅใ™ใ‚‹ JavaScript ใ‚นใƒ‹ใƒšใƒƒใƒˆใซๅค‰ๆ›
34+
- Sass ใƒ•ใ‚กใ‚คใƒซใ‚’ใƒ—ใƒฌใƒผใƒณใช CSS ใซใƒˆใƒฉใƒณใ‚นใƒ‘ใ‚คใƒซใ—ใ€`<style>` ใ‚ฟใ‚ฐใจใ—ใฆๆŒฟๅ…ฅใ™ใ‚‹ JavaScript ใ‚นใƒ‹ใƒšใƒƒใƒˆใซๅค‰ๆ›
3535
- HTML ใพใŸใฏ CSS ใงๅ‚็…งใ•ใ‚Œใ‚‹ใ‚คใƒกใƒผใ‚ธใƒ•ใ‚กใ‚คใƒซใ‚’ๅ‡ฆ็†ใ—ใ€ใƒ‘ใ‚นใฎ่จญๅฎšใซๅŸบใฅใ„ใŸ็›ฎ็š„ใฎๅ ดๆ‰€ใซ็งปๅ‹•ใ—ใ€md5 ใƒใƒƒใ‚ทใƒฅใ‚’ไฝฟ็”จใ—ใฆๅๅ‰ไป˜ใ‘
3636

3737
webpack ใฏ้žๅธธใซๅผทๅŠ›ใงใ™ใ€‚ใฉใฎใ‚ˆใ†ใซๅ‹•ไฝœใ™ใ‚‹ใ‹็†่งฃใ™ใ‚Œใฐใ€ใƒ•ใƒญใƒณใƒˆใ‚จใƒณใƒ‰้–‹็™บใฎใƒฏใƒผใ‚ฏใƒ•ใƒญใƒผใ‚’ๅЇ็š„ใซๅ‘ไธŠใ•ใ›ใ‚‹ใ“ใจใŒๅ‡บๆฅใพใ™ใ€‚ๆฌ ็‚นใจใ—ใฆใฏๅ†—้•ทใง่ค‡้›‘ใชๆง‹ๆˆใงใ™ใ€‚ใ—ใ‹ใ—ใ€ใ“ใฎใ‚ฌใ‚คใƒ‰ใงใฏ Vue.js ใจ `vue-loader` ใงใฎ webpack ใ‚’ไฝฟ็”จใ™ใ‚‹้š›ใซไธ€่ˆฌ็š„ใชๅ•้กŒใฎ่งฃๆฑบ็ญ–ใ‚’่ฆ‹ใคใ‘ใ‚‹ใ“ใจใŒใงใใ‚‹ใฏใšใงใ™ใ€‚

โ€Ždocs/ja/configurations/pre-processors.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,23 +4,23 @@ webpack ใซใŠใ„ใฆใ€ๅ…จใฆใฎใƒ—ใƒชใƒ—ใƒญใ‚ปใƒƒใ‚ตใฏๅฏพๅฟœใ™ใ‚‹ loader ใ‚’
44

55
### CSS
66

7-
ไพ‹ใˆใฐใ€SASS ใง `<style>` ใ‚ฟใ‚ฐใ‚’ใ‚ณใƒณใƒ‘ใ‚คใƒซใ—ใพใ—ใ‚‡ใ†:
7+
ไพ‹ใˆใฐใ€Sass ใง `<style>` ใ‚ฟใ‚ฐใ‚’ใ‚ณใƒณใƒ‘ใ‚คใƒซใ—ใพใ—ใ‚‡ใ†:
88

99
``` bash
1010
npm install sass-loader node-sass --save-dev
1111
```
1212

1313
``` html
1414
<style lang="sass">
15-
/* ใ“ใ“ใซSASSใ‚’ๆ›ธใใพใ™ */
15+
/* ใ“ใ“ใซSassใ‚’ๆ›ธใใพใ™ */
1616
</style>
1717
```
1818

1919
`<style>` ใ‚ฟใ‚ฐๅ†…ใฎใƒ†ใ‚ญใ‚นใƒˆใ‚ณใƒณใƒ†ใƒณใƒ„ใฏใ€`sass-loader` ใซใ‚ˆใฃใฆๆœ€ๅˆใซใ‚ณใƒณใƒ‘ใ‚คใƒซใ•ใ‚Œใ€ใใฎๅพŒใฎๅ‡ฆ็†ใฎใŸใ‚ใซๆธกใ•ใ‚Œใพใ™ใ€‚
2020

2121
#### sass-loader ไฝฟ็”จๆ™‚ใฎๆณจๆ„
2222

23-
ใใฎๅๅ‰ใŒ็คบใ™ใ‚‚ใฎใจใฏๅฏพ็…ง็š„ใซใ€[* sass * -loader](https://github.com/jtangelder/sass-loader) ใฏใƒ‡ใƒ•ใ‚ฉใƒซใƒˆใง *SCSS* ใฎๆง‹ๆ–‡ใ‚’่งฃๆžใ—ใพใ™ใ€‚ใ‚คใƒณใƒ‡ใƒณใƒˆใ•ใ‚ŒใŸ *SASS* ๆง‹ๆ–‡ใ‚’ๅฎŸ้š›ใซไฝฟ็”จใ™ใ‚‹ๅ ดๅˆใฏใ€ใใ‚Œใซๅฟœใ˜ใฆ sass-loader ใธ vue-loader ใฎใ‚ชใƒ—ใ‚ทใƒงใƒณใ‚’่จญๅฎšใ™ใ‚‹ๅฟ…่ฆใŒใ‚ใ‚Šใพใ™ใ€‚
23+
ใใฎๅๅ‰ใŒ็คบใ™ใ‚‚ใฎใจใฏๅฏพ็…ง็š„ใซใ€[* sass * -loader](https://github.com/jtangelder/sass-loader) ใฏใƒ‡ใƒ•ใ‚ฉใƒซใƒˆใง *SCSS* ใฎๆง‹ๆ–‡ใ‚’่งฃๆžใ—ใพใ™ใ€‚ใ‚คใƒณใƒ‡ใƒณใƒˆใ•ใ‚ŒใŸ *Sass* ๆง‹ๆ–‡ใ‚’ๅฎŸ้š›ใซไฝฟ็”จใ™ใ‚‹ๅ ดๅˆใฏใ€ใใ‚Œใซๅฟœใ˜ใฆ sass-loader ใธ vue-loader ใฎใ‚ชใƒ—ใ‚ทใƒงใƒณใ‚’่จญๅฎšใ™ใ‚‹ๅฟ…่ฆใŒใ‚ใ‚Šใพใ™ใ€‚
2424

2525
```javascript
2626
{

โ€Ždocs/ja/start/spec.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,11 +30,11 @@ export default {
3030

3131
`vue-loader` ใฏใƒ•ใ‚กใ‚คใƒซใ‚’่งฃๆžใ—ใ€ใใ‚Œใžใ‚Œใฎ่จ€่ชžใƒ–ใƒญใƒƒใ‚ฏใ‚’ๅฟ…่ฆใซๅฟœใ˜ใฆไป–ใฎ loader ใ‚’้€šใ—ใ€ๆœ€็ต‚็š„ใซ `module.exports` ใŒ Vue.js ใฎใ‚ณใƒณใƒใƒผใƒใƒณใƒˆใ‚ชใƒ—ใ‚ทใƒงใƒณใ‚ชใƒ–ใ‚ธใ‚งใ‚ฏใƒˆใฎ CommonJS ใƒขใ‚ธใƒฅใƒผใƒซใซๅค‰ๆ›ใ—ใพใ™ใ€‚
3232

33-
`vue-loader` ใฏ CSS ใƒ—ใƒชใƒ—ใƒญใ‚ปใƒƒใ‚ตใ‚„ HTML ใซใ‚ณใƒณใƒ‘ใ‚คใƒซใ™ใ‚‹ใƒ†ใƒณใƒ—ใƒฌใƒผใƒˆ่จ€่ชžใจใ„ใฃใŸใ€ใƒ‡ใƒ•ใ‚ฉใƒซใƒˆใงใชใ„่จ€่ชžใ‚’่จ€่ชžใƒ–ใƒญใƒƒใ‚ฏใฎ `lang` ๅฑžๆ€งใ‚’ไฝฟ็”จใ™ใ‚‹ใ“ใจใงใ‚ตใƒใƒผใƒˆใ—ใพใ™ใ€‚ไพ‹ใˆใฐใ‚ณใƒณใƒใƒผใƒใƒณใƒˆใฎใ‚นใ‚ฟใ‚คใƒซใซ SASS ใ‚’ไฝฟ็”จใ™ใ‚‹ใ“ใจใŒๅ‡บๆฅใพใ™ใ€‚
33+
`vue-loader` ใฏ CSS ใƒ—ใƒชใƒ—ใƒญใ‚ปใƒƒใ‚ตใ‚„ HTML ใซใ‚ณใƒณใƒ‘ใ‚คใƒซใ™ใ‚‹ใƒ†ใƒณใƒ—ใƒฌใƒผใƒˆ่จ€่ชžใจใ„ใฃใŸใ€ใƒ‡ใƒ•ใ‚ฉใƒซใƒˆใงใชใ„่จ€่ชžใ‚’่จ€่ชžใƒ–ใƒญใƒƒใ‚ฏใฎ `lang` ๅฑžๆ€งใ‚’ไฝฟ็”จใ™ใ‚‹ใ“ใจใงใ‚ตใƒใƒผใƒˆใ—ใพใ™ใ€‚ไพ‹ใˆใฐใ‚ณใƒณใƒใƒผใƒใƒณใƒˆใฎใ‚นใ‚ฟใ‚คใƒซใซ Sass ใ‚’ไฝฟ็”จใ™ใ‚‹ใ“ใจใŒๅ‡บๆฅใพใ™ใ€‚
3434

3535
``` html
3636
<style lang="sass">
37-
/* SASS ใงๆ›ธใใพใ™! */
37+
/* Sass ใงๆ›ธใใพใ™! */
3838
</style>
3939
```
4040
่ฉณ็ดฐใฏ [ใƒ—ใƒชใƒ—ใƒญใ‚ปใƒƒใ‚ตใฎไป•ๆง˜](../configurations/pre-processors.md) ใง็ขบ่ชใ™ใ‚‹ใ“ใจใŒๅ‡บๆฅใพใ™ใ€‚

โ€Ždocs/kr/README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
๋‹ค์Œ์€ `vue-loader`๊ฐ€ ์ œ๊ณตํ•˜๋Š” ์—ฌ๋Ÿฌ๊ฐ€์ง€ ์œ ์šฉํ•œ ๊ธฐ๋Šฅ์ž…๋‹ˆ๋‹ค.
1010

1111
- ๊ธฐ๋ณธ์ ์œผ๋กœ ES2015๋ฅผ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค.
12-
- ๊ฐ Vue ์ปดํฌ๋„ŒํŠธ ๋งˆ๋‹ค ์„œ๋กœ ๋‹ค๋ฅธ webpack ๋กœ๋”๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ๋“ค๋ฉด `<style>`์— SASS, `<template>`์— Jade๋กœ ๊ฐ๊ฐ ์„ค์ • ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค.
12+
- ๊ฐ Vue ์ปดํฌ๋„ŒํŠธ ๋งˆ๋‹ค ์„œ๋กœ ๋‹ค๋ฅธ webpack ๋กœ๋”๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ๋“ค๋ฉด `<style>`์— Sass, `<template>`์— Jade๋กœ ๊ฐ๊ฐ ์„ค์ • ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค.
1313
- `<style>`๊ณผ `<template>`์—์„œ ์ฐธ์กฐ๋œ ์ •์  Asset ํŒŒ์ผ์„ ๋ชจ๋“ˆ๋กœ ์ทจ๊ธ‰ํ•˜๊ณ  webpack ๋กœ๋”๋กœ ์ฒ˜๋ฆฌํ•ฉ๋‹ˆ๋‹ค.
1414
- ๊ฐ ์ปดํฌ๋„ŒํŠธ๋งˆ๋‹ค ์ง€์ •๋œ CSS๋ฅผ ์‹œ๋ฎฌ๋ ˆ์ดํŠธ ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
1515
- ๊ฐœ๋ฐœ ์ค‘์— ์ปดํฌ๋„ŒํŠธ ํ•ซ ๋ฆฌ๋กœ๋”ฉ์„ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค.
@@ -31,7 +31,7 @@
3131
- ES2015 ๋˜๋Š” CoffeeScript, TypeScript ๋ชจ๋“ˆ์„ ES5 CommonJS ๋ชจ๋“ˆ๋กœ ๋ณ€ํ™˜ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
3232
- ์„ ํƒ ์‚ฌํ•ญ์œผ๋กœ ์ปดํŒŒ์ผ ์ „์— linter๋ฅผ ์ด์šฉํ•˜์—ฌ ์†Œ์Šค ์ฝ”๋“œ๋ฅผ ์—ฐ๊ฒฐ ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
3333
- Jade ํ…œํ”Œ๋ฆฟ์„ ์ผ๋ฐ˜ HTML๋กœ ๋ณ€๊ฒฝํ•˜๊ณ  JavaScript ๋ฌธ์ž์—ด๋กœ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค.
34-
- SASS ํŒŒ์ผ์„ ์ผ๋ฐ˜ CSS๋กœ ๋ณ€ํ™˜ํ•œ ๋‹ค์Œ CSS๋ฅผ `<style>` ํƒœ๊ทธ๋กœ ์‚ฝ์ž…ํ•˜๋Š” JavaScript ์Šค๋‹ˆํŽซ์œผ๋กœ ๋ณ€ํ™˜ํ•ฉ๋‹ˆ๋‹ค.
34+
- Sass ํŒŒ์ผ์„ ์ผ๋ฐ˜ CSS๋กœ ๋ณ€ํ™˜ํ•œ ๋‹ค์Œ CSS๋ฅผ `<style>` ํƒœ๊ทธ๋กœ ์‚ฝ์ž…ํ•˜๋Š” JavaScript ์Šค๋‹ˆํŽซ์œผ๋กœ ๋ณ€ํ™˜ํ•ฉ๋‹ˆ๋‹ค.
3535
- HTML ๋˜๋Š” CSS์—์„œ ์ฐธ์กฐ๋œ ์ด๋ฏธ์ง€ ํŒŒ์ผ์„ ์ฒ˜๋ฆฌํ•˜๊ณ  ๊ฒฝ๋กœ ๊ตฌ์„ฑ์— ๋”ฐ๋ผ ์ด๋™ํ•œ ํ›„ md5 ํ•ด์‹œ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ด๋ฆ„์„ ์ง€์ •ํ•ฉ๋‹ˆ๋‹ค.
3636

3737
webpack์€ ๋งค์šฐ ๊ฐ•๋ ฅํ•˜๋ฉฐ ์ž‘๋™ ์›๋ฆฌ๋ฅผ ์ดํ•ดํ•œ๋‹ค๋ฉด ํ”„๋ก ํŠธ์—”๋“œ ์ž‘์—…ํ™˜๊ฒฝ์„ ํš๊ธฐ์ ์œผ๋กœ ํ–ฅ์ƒ์‹œํ‚ฌ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๊ตฌ์„ฑํ•˜๊ธฐ์— ์žฅํ™ฉํ•˜๊ณ  ๋ณต์žกํ•œ ๊ฒƒ์ด ๋‹จ์ ์ž…๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ ์ด ๊ฐ€์ด๋“œ๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด Vue.js ๋ฐ `vue-loader`์—์„œ webpack์„ ์‚ฌ์šฉํ•  ๋•Œ ๊ฐ€์žฅ ์ผ๋ฐ˜์ ์ธ ๋ฌธ์ œ์— ๋Œ€ํ•œ ์†”๋ฃจ์…˜์„ ์ฐพ์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

โ€Ždocs/kr/configurations/pre-processors.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ webpack์—์„œ๋Š” ๋ชจ๋“  ์ „์ฒ˜๋ฆฌ๊ธฐ๊ฐ€ ํ•ด๋‹น ๋กœ๋”์™€ ํ•จ๊ป˜ ์ ์šฉ๋˜์–ด์•ผ
44

55
### CSS
66

7-
์˜ˆ๋ฅผ ๋“ค์–ด, SASS๋กœ `<style>`์„ ์ปดํŒŒ์ผํ•ด๋ด…์‹œ๋‹ค.
7+
์˜ˆ๋ฅผ ๋“ค์–ด, Sass๋กœ `<style>`์„ ์ปดํŒŒ์ผํ•ด๋ด…์‹œ๋‹ค.
88

99
``` bash
1010
npm install sass-loader node-sass --save-dev

โ€Ždocs/kr/start/spec.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,11 +30,11 @@ export default {
3030

3131
`vue-loader`๋Š” ํŒŒ์ผ์„ ํŒŒ์‹ฑํ•˜๊ณ  ๊ฐ language block์„ ์ถ”์ถœํ•˜๋ฉฐ ํ•„์š”ํ•œ ๊ฒฝ์šฐ ๋‹ค๋ฅธ ๋กœ๋”๋ฅผ ํ†ตํ•ด ํŒŒ์ดํ”„ ์ฒ˜๋ฆฌํ•œ ํ›„ ๋งˆ์ง€๋ง‰์œผ๋กœ Module.exports๊ฐ€ Vue.js ์ปดํฌ๋„ŒํŠธ ์—˜๋ฆฌ๋จผํŠธ ์˜ต์…˜ ๊ฐ์ฒด์ธ CommonJS ๋ชจ๋“ˆ๋กœ ๋‹ค์‹œ ์กฐํ•ฉํ•ฉ๋‹ˆ๋‹ค.
3232

33-
`vue-loader`๋Š” language block์— `lang` ์†์„ฑ์„ ์ง€์ •ํ•˜์—ฌ CSS ์ „์ฒ˜๋ฆฌ๊ธฐ๋‚˜ HTML์—์„œ ํ…œํ”Œ๋ฆฟ์„ ์ปดํŒŒ์ผ ํ•˜๋Š” ๊ฒƒ๊ณผ ๊ฐ™์€ ๊ธฐ๋ณธ ์–ธ์–ด๊ฐ€ ์•„๋‹Œ ๊ฒƒ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ•ฉ๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด ์ปดํฌ๋„ŒํŠธ ์Šคํƒ€์ผ์— SASS๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
33+
`vue-loader`๋Š” language block์— `lang` ์†์„ฑ์„ ์ง€์ •ํ•˜์—ฌ CSS ์ „์ฒ˜๋ฆฌ๊ธฐ๋‚˜ HTML์—์„œ ํ…œํ”Œ๋ฆฟ์„ ์ปดํŒŒ์ผ ํ•˜๋Š” ๊ฒƒ๊ณผ ๊ฐ™์€ ๊ธฐ๋ณธ ์–ธ์–ด๊ฐ€ ์•„๋‹Œ ๊ฒƒ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ•ฉ๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด ์ปดํฌ๋„ŒํŠธ ์Šคํƒ€์ผ์— Sass๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
3434

3535
``` html
3636
<style lang="sass">
37-
/* write SASS! */
37+
/* write Sass! */
3838
</style>
3939
```
4040

0 commit comments

Comments
ย (0)