解決vue cli4升級(jí)sass-loader(v8)后報(bào)錯(cuò)問(wèn)題
sass-loader報(bào)錯(cuò):
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):ValidationError: Invalid options object. Sass Loader has been initialized using an options object that does not match the API schema. - options has an unknown property ’data’. These properties are valid: object { implementation?, sassOptions?, prependData?, sourceMap?, webpackImporter? } at validate (D:webzhijieProjectsylvisiblenode_modulesschema-utilsdistvalidate.js:85:11) at Object.loader (D:webzhijieProjectsylvisiblenode_modulessass-loaderdistindex.js:36:28)
@ ./node_modules/vue-style-loader??ref--8-oneOf-1-0!./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src??ref--8-oneOf-1-2!./node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/base/chart-interaction/chart-interaction.vue?vue&type=style&index=0&lang=scss& 4:14-484 14:3-18:5 15:22-492 @ ./src/components/base/chart-interaction/chart-interaction.vue?vue&type=style&index=0&lang=scss& @ ./src/components/base/chart-interaction/chart-interaction.vue @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/layout/rightSideBar/RightSideBar.vue?vue&type=script&lang=js& @ ./src/components/layout/rightSideBar/RightSideBar.vue?vue&type=script&lang=js& @ ./src/components/layout/rightSideBar/RightSideBar.vue @ ./src/components/layout/index.js @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/home/Home.vue?vue&type=script&lang=js& @ ./src/views/home/Home.vue?vue&type=script&lang=js& @ ./src/views/home/Home.vue
修改方法:
vue.config.js
css: { loaderOptions: { sass: { data: ’@import '@/assets/styles/share.scss';’ } } },
修改成
css: { loaderOptions: { sass: { prependData: ’@import '@/assets/styles/share.scss';’ } } },
data改成prependData
補(bǔ)充知識(shí):Vue項(xiàng)目中使用jquery插件
1、引入jquery,并且在vue.config.js里配置
config.plugin(’provide’) .use(webpack.ProvidePlugin, [{ $: ’jquery’, jquery: ’jquery’, jQuery: ’jquery’, ’window.jQuery’: ’jquery’ }])
2、下載hquery插件,放到public中
3、直接在組件里使用
備注:在vue里使用jquery改變樣式的時(shí)候,一定要在setTimeout里調(diào)用
以上這篇解決vue cli4升級(jí)sass-loader(v8)后報(bào)錯(cuò)問(wèn)題就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持好吧啦網(wǎng)。
相關(guān)文章:
1. 如何基于Python Matplotlib實(shí)現(xiàn)網(wǎng)格動(dòng)畫2. 利用promise及參數(shù)解構(gòu)封裝ajax請(qǐng)求的方法3. ASP 信息提示函數(shù)并作返回或者轉(zhuǎn)向4. asp(vbs)Rs.Open和Conn.Execute的詳解和區(qū)別及&H0001的說(shuō)明5. ThinkPHP5實(shí)現(xiàn)JWT Token認(rèn)證的過(guò)程(親測(cè)可用)6. Ajax實(shí)現(xiàn)表格中信息不刷新頁(yè)面進(jìn)行更新數(shù)據(jù)7. JSP數(shù)據(jù)交互實(shí)現(xiàn)過(guò)程解析8. windows服務(wù)器使用IIS時(shí)thinkphp搜索中文無(wú)效問(wèn)題9. .NET中l(wèi)ambda表達(dá)式合并問(wèn)題及解決方法10. PHP設(shè)計(jì)模式中工廠模式深入詳解
