작성
·
316
1
rollup.config.js 파일에
preprocess: sveltePreprocess()를 실행하는 위치가 어떻게 되는지요? config.js 파일의 구조가 약간 달라졌습니다.
package.json 파일에서
@rollup/plugin-commonjs:^15.1.0
@rollup/plugin-node-resolve: ^9.0.0
추가로 설치된 node-sass: ^7.0.1
svelte-preprocess: ^4.10.7
rollup.config.js 파일에서
import svelte from 'rollup-plugin-svelte';
import commonjs from '@rollup/plugin-commonjs';
import resolve from '@rollup/plugin-node-resolve';
import livereload from 'rollup-plugin-livereload';
import { terser } from 'rollup-plugin-terser';
import css from 'rollup-plugin-css-only'; // 강의에는 없는 행
// svlete-preprocessor import 한다.
import sveltePreprocess from 'svelte-preprocess';
아래 plugins 블록에서는
강의에서와는 블록의 구조가 달라져 있습니다.
plugins: [
// 여기 블록의 구조가 달라 정확하게 어디에서 sveltePreporcess()를 실행해야
// 하는지요. 아래 기술된 위치에 넣으니까 중첩 스타일에서 오류가 발생합니다.
svelte({
compilerOptions: {
// enable run-time checks when not in production
dev: !production
}
}),
// we'll extract any component CSS out into
// a separate file - better for performance
css({ output: 'bundle.css' }),
sveltePreprocess(),
// scss를 추가하기 위해 여기서 실행... ???
// If you have external dependencies installed from
// npm, you'll most likely need these plugins. In
// some cases you'll need additional configuration -
// consult the documentation for details:
// https://github.com/rollup/plugins/tree/master/packages/commonjs
resolve({
browser: true,
dedupe: ['svelte']
}),
commonjs(),
답변 1
0
Byung-Ryul Lee 님 안녕하세요~😊
제가 최근에 일이 바빠서 질문 확인을 못하고 있었습니다.
많이 기다리셨을 텐데 죄송합니다.🙏
내용을 확인하니, 최신 Svelte/Template이 일부 업데이트가 되었네요.
다행인 것은 강의 내용 대비 새롭게 추가된 일부 내용이 있지만, 사용법은 달라지지 않았습니다.
SveltePreprocess 사용도 동일하고, 혹시 몰라 테스트를 했는데 잘 동작하네요.
테스트한 rollup.config.js 내용 첨부하니 참고하시면 좋겠네요.