Skip to content
New issue

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

Can't import more than one CSS file #94

Open
heyfadii opened this issue Feb 2, 2020 · 4 comments
Open

Can't import more than one CSS file #94

heyfadii opened this issue Feb 2, 2020 · 4 comments

Comments

@heyfadii
Copy link

heyfadii commented Feb 2, 2020

When adding more than one CSS file to the nuxt.config.js file, building fails. A single css file works fine.
I used the nuxt7 starter and my config file looks like this:

module.exports = {
  // Nuxt modules
  modules: [
    'nuxt7',
    '@nuxtjs/pwa'
  ],

  // PWA manifest
  // https://github.com/nuxt-community/pwa-module
  manifest: {
    name: 'nuxt7-app',
    description: ''
  },

  // Framework7 Config
  framework7: {
    // ...
  },

  // Build configuration
  build: {
    // Extract CSS in a separated file
    extractCSS: true,

    // You can extend webpack config here
    extend (config) {
      // ...
    }
  },

  // Additional CSS configuration
  css: [
    'assets/app.css',
    'assets/app2.css'
  ]
}

Building fails and I get this message:

 ERROR  Failed to compile with 1 errors                                                                                                                                    friendly-errors 01:37:26


 ERROR  in ./.nuxt/App.js                                                                                                                                                  friendly-errors 01:37:26

Syntax Error: Unexpected token, expected ";" (11:27)                                                                                                                       friendly-errors 01:37:26

   9 |
  10 | // User provided styles
> 11 | import '../assets/app.styl',import '../assets/app2.styl'
     |                            ^
  12 |
  13 | // Default layout
  14 | import defaultLayout from '../layouts/default.vue'
    at parser.next (<anonymous>)
    at normalizeFile.next (<anonymous>)
@heyfadii heyfadii changed the title Can't import more than CSS file Can't import more than one CSS file Feb 2, 2020
@anilwarbhe
Copy link

I am also receiving the same error. How can I resolve it?

@anilwarbhe
Copy link

Updated App.js

Replaced:
<% css.map(c=> import '${relativeToBuild(resolvePath(c.src || c))}') %>

With:

<%
for (let i=0;i<css.length;i++){
%>
  import '<%= relativeToBuild(resolvePath(css[i].src || css[i])) %>';
<%
}
%>

And now it works.

@sprabowo
Copy link
Contributor

Hi @fabu-gharbieh @anilwarbhe
I think this issue has solved and merged

@sprabowo
Copy link
Contributor

sprabowo commented Jun 9, 2020

@pi0 please help to close this issue. Thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants