Pereiti prie turinio

[Baigta] Webpack ir Next.js (React) neužkrauna stiliaus failų (netinkamai)


Rekomenduojami pranešimai

Sveiki. Next.js neturi jokių loaderių, tai tenka verstis su webpacku.

 

Erroras:

Error in ../../assets/css/style.cssModule parse failed: Unexpected character '@' (1:0) You may need an appropriate loader to handle this file type. | @import url('https://fonts.googleapis.com/css?family=Open+Sans'); | | .pointer {

 

webpack.config.js

module.exports = {
   module: {
       rules: [
           {
               test: /\.(js|jsx)$/,
               use: [{
                   loader: 'babel-loader',
                   options: {
                       babelrc: false,
                       presets: ['env', 'react']
                   }
               }]
           },
           {
               test: /\.css$/,
               loader: 'style!css?importLoaders=1'
           }
       ]
   }};

Redagavo NamelessSpy
Nuoroda į pranešimą
Dalintis kituose puslapiuose

Klaida parašyta juk. Išversti į lietuvių k. gal?

 

Dėmesio maža ar postus renki? Nerašyk nesąmonių.

 

P.S susitvarkiau.

 

next.config.js failas kam įdomu:

module.exports = {
   webpack: (config, {dev}) => {
       config.module.rules.push(
           {
               test: /\.css$/,
               loader: 'emit-file-loader',
               options: {
                   name: 'dist/[path][name].[ext]',
               },
           },
           {
               test: /\.css$/,
               // Simplest way (non-minified)..
               loader: `babel-loader!next-style-loader`,
               // Use `css-loader` to minify and enable source maps
               // NOTE: The `url` option from the css loader must be disabled; images, fonts, etc should go into /static
               loader: `babel-loader!next-style-loader!css-loader?sourceMap&minimize=${!dev}&url=false`,
               // Same as above but with CSS modules
               loader: `babel-loader!next-style-loader!css-loader?sourceMap&minimize=${!dev}&url=false&modules`,
               // Example with `css-loader` and `postcss-loader' (you may also activate CSS modules just like above)
               // Enable `postcss-imports` plugin must be enabled in the `postcss.config.js` file to process @import declarations
               loader: `babel-loader!next-style-loader!css-loader?sourceMap&minimize=${!dev}&url=false!postcss-loader`,
               // Example with `css-loader` and `sass-loader'
               loader: `babel-loader!next-style-loader!css-loader?sourceMap&minimize=${!dev}&url=false!sass-loader`,
           }
       );

       return config;
   },
};

Nuoroda į pranešimą
Dalintis kituose puslapiuose

Prisijunkite prie diskusijos

Jūs galite rašyti dabar, o registruotis vėliau. Jeigu turite paskyrą, prisijunkite dabar, kad rašytumėte iš savo paskyros.

Svečias
Parašykite atsakymą...

×   Įdėta kaip raiškusis tekstas.   Atkurti formatavimą

  Only 75 emoji are allowed.

×   Nuorodos turinys įdėtas automatiškai.   Rodyti kaip įprastą nuorodą

×   Jūsų anksčiau įrašytas turinys buvo atkurtas.   Išvalyti redaktorių

×   You cannot paste images directly. Upload or insert images from URL.

Įkraunama...
  • Dabar naršo   0 narių

    Nei vienas registruotas narys šiuo metu nežiūri šio puslapio.

  • Prisijunk prie bendruomenės dabar!

    Uždarbis.lt nariai domisi verslo, IT ir asmeninio tobulėjimo temomis, kartu sprendžia problemas, dalinasi žiniomis ir idėjomis, sutinka būsimus verslo partnerius ir dalyvauja gyvuose susitikimuose.

    Užsiregistruok dabar ir galėsi:

    ✔️ Dalyvauti diskusijose;

    ✔️ Kurti naujas temas;

    ✔️ Rašyti atsakymus;

    ✔️ Vertinti kitų žmonių pranešimus;

    ✔️ Susisiekti su bet kuriuo nariu asmeniškai;

    ✔️ Naudotis tamsia dizaino versija;

    ir dar daugiau.

    Registracija trunka ~30 sek. ir yra visiškai nemokama.

  • Naujausios temos

  • Karštos temos

×
×
  • Pasirinkite naujai kuriamo turinio tipą...