Webpack css unexpected character

Как решить Module parse failed: Unexpected character ‘@’ при экспорте стилей Swiper?

Видел статьи с объяснением как решить данную проблему для webpack, нужно добавить следующий код в webpack.config.js:
test: /\.(sass|less|css)$/,
use: [«style-loader», «css-loader», ‘sass-loader’],
>
Проблема в том, что я не знаю аналог этого файла для сборки gulp, куда именно вставлять этот код, чтобы не нарушить работу самой сборки? Если это поможет, то я использую сборку «Фрилансер по жизни»

Файлы, куда предположительно нужно вставить код:

import dartSass from 'sass'; import gulpSass from 'gulp-sass'; import rename from 'gulp-rename'; import cleanCss from 'gulp-clean-css'; // Сжатие CSS файла import webpcss from 'gulp-webpcss'; // Вывод WEBP изображений import autoprefixer from 'gulp-autoprefixer'; // Добавление вендорных префиксов import groupCssMediaQueries from 'gulp-group-css-media-queries'; // Групировка медиа запросов const sass = gulpSass(dartSass); export const scss = () => < return app.gulp.src(app.path.src.scss, < sourcemaps: app.isDev >) .pipe(app.plugins.plumber( app.plugins.notify.onError(< title: "SCSS", message: "Error: " >))) .pipe(sass(< outputStyle: 'expanded' >)) .pipe(app.plugins.replace(/@img\//g, '../img/')) .pipe( app.plugins.if( app.isBuild, groupCssMediaQueries() ) ) .pipe( app.plugins.if( app.isBuild, autoprefixer(< grid: true, overrideBrowserslist: ["last 3 versions"], cascade: true >) ) ) .pipe( app.plugins.if( app.isBuild, webpcss( < webpClass: ".webp", noWebpClass: ".no-webp" >) ) ) .pipe(app.gulp.dest(app.path.build.css)) .pipe( app.plugins.if( app.isBuild, cleanCss() ) ) .pipe(rename(< extname: ".min.css" >)) .pipe(app.gulp.dest(app.path.build.css)) .pipe(app.plugins.browsersync.stream()); >

import webpack from "webpack-stream"; export const js = () => < return app.gulp.src(app.path.src.js, < sourcemaps: app.isDev >) .pipe(app.plugins.plumber( app.plugins.notify.onError(< title: "JS", message: "Error: " >)) ) .pipe(webpack( < mode: app.isBuild ? 'production' : 'development', output: < filename: 'app.min.js', >>)) .pipe(app.gulp.dest(app.path.build.js)) .pipe(app.plugins.browsersync.stream()); >

Если нужна дополнительная информация, пожалуйста сообщите мне об этом, заранее спасибо!

Источник

Saved searches

Use saved searches to filter your results more quickly

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session.

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Does not resolve @import. Module parse failed: Unexpected character ‘@’ #344

Does not resolve @import. Module parse failed: Unexpected character ‘@’ #344

Comments

The loader can’t resolve @import s, throws error. Config file is just fine, but sass-loader throws errors anyhow:

ERROR in ./assets/sass/index.scss Module parse failed: C:\Users\user\app\assets\sass\index.scss Unexpected character '@' (2:0) You may need an appropriate loader to handle this file type. SyntaxError: Unexpected character '@' (2:0) 

module: < loaders: [ < test: /\.scss$/i, include: [ path.resolve(__dirname, '..', 'node_modules', 'bootstrap/scss') ], loaders: [ 'css-loader?minimize', 'sass-loader' ] >, < test: /\.css$/i, loader: 'css-loader?-minimize', >, < test: /\.js$/i, exclude: /(node_modules|bower_components)/, loader: 'babel-loader', query: < presets: ['es2015', "stage-0", "react"] >> ] >, sassLoader: < indentWidth: 4, outputStyle: 'expanded', sourceComments: true, >, target: 'node' 

let css = require('index.scss'); 

However, it works all right if I call loaders inline:

let css = require('css-loader!sass-loader!index.scss'); 

Why? I need a config, not inline

The text was updated successfully, but these errors were encountered:

Источник

Saved searches

Use saved searches to filter your results more quickly

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session.

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Does not resolve @import. Module parse failed: Unexpected character ‘@’ #344

Does not resolve @import. Module parse failed: Unexpected character ‘@’ #344

Comments

The loader can’t resolve @import s, throws error. Config file is just fine, but sass-loader throws errors anyhow:

ERROR in ./assets/sass/index.scss Module parse failed: C:\Users\user\app\assets\sass\index.scss Unexpected character '@' (2:0) You may need an appropriate loader to handle this file type. SyntaxError: Unexpected character '@' (2:0) 

module: < loaders: [ < test: /\.scss$/i, include: [ path.resolve(__dirname, '..', 'node_modules', 'bootstrap/scss') ], loaders: [ 'css-loader?minimize', 'sass-loader' ] >, < test: /\.css$/i, loader: 'css-loader?-minimize', >, < test: /\.js$/i, exclude: /(node_modules|bower_components)/, loader: 'babel-loader', query: < presets: ['es2015', "stage-0", "react"] >> ] >, sassLoader: < indentWidth: 4, outputStyle: 'expanded', sourceComments: true, >, target: 'node' 

let css = require('index.scss'); 

However, it works all right if I call loaders inline:

let css = require('css-loader!sass-loader!index.scss'); 

Why? I need a config, not inline

The text was updated successfully, but these errors were encountered:

Источник

Saved searches

Use saved searches to filter your results more quickly

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session.

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ModuleParseError: Module parse failed: Unexpected character » (1:6) #303

ModuleParseError: Module parse failed: Unexpected character » (1:6) #303

Comments

»»
ERROR in ./node_modules/photoswipe/dist/default-skin/default-skin.css
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleParseError: Module parse failed: Unexpected character » (1:6)
You may need an appropriate loader to handle this file type.
(Source code omitted for this binary file)
at handleParseError (/Users/sean/p/react-utils-lite/node_modules/webpack/lib/NormalModule.js:432:19)
at doBuild.err (/Users/sean/p/react-utils-lite/node_modules/webpack/lib/NormalModule.js:466:5)
at runLoaders (/Users/sean/p/react-utils-lite/node_modules/webpack/lib/NormalModule.js:327:12)
at /Users/sean/p/react-utils-lite/node_modules/loader-runner/lib/LoaderRunner.js:370:3
at iterateNormalLoaders (/Users/sean/p/react-utils-lite/node_modules/loader-runner/lib/LoaderRunner.js:211:10)
at Array. (/Users/sean/p/react-utils-lite/node_modules/loader-runner/lib/LoaderRunner.js:202:4)
at Storage.finished (/Users/sean/p/react-utils-lite/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:43:16)
at provider (/Users/sean/p/react-utils-lite/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:79:9)
at /Users/sean/p/react-utils-lite/node_modules/graceful-fs/graceful-fs.js:78:16
at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:528:3)
@ ./src/photoswipe-demo.js 3:8-203
@ ./src/index.js
@ multi idempotent-babel-polyfill ./src/index.js
»»

The text was updated successfully, but these errors were encountered:

Источник