We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
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
平时做项目, 总是会创建一个存放全局 scss 变量的文件, 比如叫 variables.scss 来统一管理各种全局样式
variables.scss
假设此文件路径为 @/assets/style/variables.scss
@/assets/style/variables.scss
我们的诉求是在各种 scss 文件或者 vue 文件中使用 scss 变量, 而不需要每个都手动引入 variables.scss
使用 vue-cli 创建的项目非常简单
只需在 vue.config.js 中加上一条
vue.config.js
css: { loaderOptions: { sass: { data: `@import "@/assets/style/variables.scss";` } } }
问题来了, nuxt.js 创建的项目该怎么整呢?
nuxt.js
Undefined variable: "$--color-primary"
看了几个小时的报错后搞出了如下配置, 亲测是完全可用的, 如果有更简单的写法请告诉我~~
build: { extend(config, ctx) { // Run ESLint on save if (ctx.isDev && ctx.isClient) { config.module.rules.push({ enforce: 'pre', test: /\.(js|vue)$/, loader: 'eslint-loader', exclude: /(node_modules)/ }) } // 此处为新增配置代码 config.module.rules.forEach((rule) => { if (/scss/.test(rule.test.toString())) { rule.oneOf.forEach(item => { item.use.push({ loader: 'sass-loader', options: { sourceMap: false, data: '@import "@/assets/style/variables.scss";' } }) }) } }) } }
The text was updated successfully, but these errors were encountered:
No branches or pull requests
平时做项目, 总是会创建一个存放全局 scss 变量的文件, 比如叫
variables.scss
来统一管理各种全局样式假设此文件路径为
@/assets/style/variables.scss
我们的诉求是在各种 scss 文件或者 vue 文件中使用 scss 变量, 而不需要每个都手动引入
variables.scss
使用 vue-cli 创建的项目非常简单
只需在
vue.config.js
中加上一条问题来了,
nuxt.js
创建的项目该怎么整呢?Undefined variable: "$--color-primary"
看了几个小时的报错后搞出了如下配置, 亲测是完全可用的, 如果有更简单的写法请告诉我~~
The text was updated successfully, but these errors were encountered: