Esta es el arreglo más válida que encomtrarás brindar, pero estúdiala pausadamente y analiza si es compatible a tu proyecto.
Solución:
Tal vez esto cubra su pregunta: ¿Cómo compilar o convertir sass/scss a css con node-sass (sin Ruby)?
Si es una opción para usted, recomendaría usar grunt, hará que las cosas sean mucho más simples y rápidas. Este complemento grunt es probablemente la mejor opción: https://www.npmjs.com/package/grunt-contrib-sass
// ACTUALIZAR
Seguí el tutorial que me enviaste y es muy sencillo. Crea un archivo en su carpeta raíz llamado “paquete.json” que contiene lo siguiente:
"watches":
"sass": "sass/**"
,
"scripts":
"sass": "node-sass sass/ -o build/css/",
"dev": "rerun-script"
Luego abre la línea de comando en la carpeta raíz y ejecuta lo siguiente:
npm install --save-dev node-sass
Lo anterior instala node-sass
Luego ejecutas:
npm install --save-dev rerun-script
Lo anterior crea una tarea de observación para que no tenga que volver a ejecutar node-sass cada vez que realice cambios
Y la última vez que corres
npm run dev
¡Hecho!
Documentación.
Si desea compilar archivos automáticamente, debe colocar el indicador -w
node-sass -w -r assets/src/scss/ -o assets/dist/css/
Mi paquete.json
"name": "my-project",
"version": "1.0.0",
"scripts":
"build:js": "watchify assets/src/js/main_1.js -o 'exorcist assets/dist/js/main_1.js.map > assets/dist/js/main_1.js' -d -t [babelify --presets [latest]]",
"build:scss": "node-sass -w -r assets/src/scss/ -o assets/dist/css/",
"build": "npm run build:scss & npm run build:js"
,
"devDependencies":
"babel-cli": "^6.0.0",
"babel-preset-latest": "^6.16.0",
"babelify": "^7.3.0",
"browserify": "^13.1.1",
"exorcist": "^0.4.0",
"node-sass": "^4.5.0",
"watchify": "^3.7.0"
,
"browserify":
"transform": [
"babelify"
]
Versión real de package.json: https://gist.github.com/artamonovdev/5f24aaca504e4d1b299bba0413f0a57d
El watch
modo en node-sass
no ejecuta la primera compilación. Se supone que ya has corrido node-sass
.
Personalmente, uso algo como esto:
"scripts":
"sass": "node-sass -o /path/to/dist /path/to/src",
"sass:watch": "npm run sass && npm run sass -- --watch --recursive"
Y puedes usarlo así: npm run sass:watch
Agradecemos que desees añadir valor a nuestro contenido añadiendo tu veteranía en las interpretaciones.