• 問題：使用vue-cli3更改ant的主題色時候報錯：Inline JavaScript is not enabled. Is it set in your options?

• 原因：我的問題是less-loader依賴包的版本為5.0.0，而官方要求必須是6.0.0；

ERROR Failed to compile with 1 errors 16:02:25error in ./node_modules/ant-design-vue/dist/antd.lessModule build failed (from ./node_modules/less-loader/dist/cjs.js):// https://github.com/ant-design/ant-motion/issues/44 .bezierEasingMixin(); ^ Inline JavaScript is not enabled. Is it set in your options?in C:\Users\***\node_modules\ant-design-vue\lib\style\color\bezierEasing.less (line 110, column 0)@ ./node_modules/ant-design-vue/dist/antd.less 4:14-188 14:3-18:5 15:22-196@ ./src/main.js@ multi (webpack)-dev-server/client?http://172.18.17.39:8080/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

問題點排查

• 是否使用了less和less-loader：如果項目使用的是scss/sass預(yù)處理器，則需要安裝less和less-loader，vue-cli3已經(jīng)在底層預(yù)留了less配置，因此無需查找文件添加配置

cnpm install less less-loader --save-dev

• 樣式不生效問題：設(shè)置好需要重新啟動
• less 的樣式被 css 的樣式覆蓋：如果你在使用 babel-plugin-import 的 style 配置來引入樣式，需要將配置值從 ‘css’ 改為 true，這樣會引入 less 文件。
• 如果在marn.js中你是通過 ‘a(chǎn)nt-design-vue/dist/antd.css’ 引入樣式的，改為 'ant-design-vue/dist/antd.less’
• 在vue cli 3 中定制主題：項目根目錄下新建文件vue.config.js
  注意：less-loader依賴包的版本一定要是6.0.0或以上

module.exports = { //vue-cli3修改ant的主題色官網(wǎng)配置 vue.config.js for less-loader@6.0.0 ||||||||注意less-loader依賴包的版本一定要是6.0.0或以上|||||||css: {loaderOptions: {less: {lessOptions: {modifyVars: {'primary-color': '#ff1f', // 全局主色 #1890ff'link-color': '#1890ff', // 鏈接色'success-color': '#52c41a', // 成功色'warning-color': '#faad14', // 警告色'error-color': '#f5222d', // 錯誤色'font-size-base': '14px', // 主字號'heading-color': 'rgba(0, 0, 0, 0.85)', // 標題色'text-color': 'rgba(0, 0, 0, 0.65)', // 主文本色'text-color-secondary': 'rgba(0, 0, 0, 0.45)', // 次文本色'disabled-color': 'rgba(0, 0, 0, 0.25)', // 失效色'border-radius-base': '4px', // 組件/浮層圓角'border-color-base': '#d9d9d9', // 邊框色'box-shadow-base': '0 2px 8px rgba(0, 0, 0, 0.15)', // 浮層陰影},javascriptEnabled: true,},},},} }

• 其他webpack 和 vue cli 2 中定制主題，可看官網(wǎng)ant自定義主題
• 親測有用，希望幫助到你！

總結(jié)

以上是生活随笔為你收集整理的ant更改主题色报错Inline JavaScript is not enabled. Is it set in your options? vue ant主题色更改 vue-cli3的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。