Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

Framework7-webpack-vue template upgrade



  • I am trying to upgrade to the latest framework7-vue, but get lots of errors when building.

    WARNING in ./node_modules/framework7/css/framework7.css (./node_modules/css-loader??ref--4-1!./node_modules/postcss-loader/lib??ref--4-2!./node_modules/framework7/css/framework7.css)
    Module Warning (from ./node_modules/postcss-loader/lib/index.js):
    (Emitted value instead of an instance of Error) postcss-custom-properties: /mnt/c/devel-linux/montest/node_modules/framework7/css/framework7.css:5258:3: Custom property ignored: not scoped to the top-level :root element (.md { ... --f7-button-large-text-transform: ... })
    
    WARNING in ./node_modules/framework7/css/framework7.css (./node_modules/css-loader??ref--4-1!./node_modules/postcss-loader/lib??ref--4-2!./node_modules/framework7/css/framework7.css)
    Module Warning (from ./node_modules/postcss-loader/lib/index.js):
    (Emitted value instead of an instance of Error) postcss-custom-properties: /mnt/c/devel-linux/montest/node_modules/framework7/css/framework7.css:5259:3: Custom property ignored: not scoped to the top-level :root element (.md { ... --f7-button-small-height: ... })
    
    WARNING in ./node_modules/framework7/css/framework7.css (./node_modules/css-loader??ref--4-1!./node_modules/postcss-loader/lib??ref--4-2!./node_modules/framework7/css/framework7.css)
    Module Warning (from ./node_modules/postcss-loader/lib/index.js):
    (Emitted value instead of an instance of Error) postcss-custom-properties: /mnt/c/devel-linux/montest/node_modules/framework7/css/framework7.css:525:3: Custom property ignored: not scoped to the top-level :root element (.border-color-deeporange { ... --f7-theme-color-border-color: ... })

  • administrators

    It’s hard to tell just from the information you gave, but it looks like you’re running postcss-custom-properties to transform your CSS and it’s throwing an error. If you’re running postcss-custom-properties by yourself (i.e. it’s not called by some other process) I would try looking at that package’s GitHub issues to see if someone else has had the same error.