[英]Can install sass-loader in Vue 3 project
I am trying to add sass/scss loader AFTER creating a project with vue CLI.我试图在使用 vue CLI 创建项目后添加 sass/scss 加载程序。 I ran this script:
$ npm install -D sass-loader@^10 sass
and I am receiving following error:我运行了这个脚本:
$ npm install -D sass-loader@^10 sass
我收到以下错误:
npm ERR! notsup Unsupported platform for fsevents@2.3.1: wanted {"os":"darwin"} (current: {"os":"linux","arch":"x64"})
npm ERR! notsup Valid OS: darwin
npm ERR! notsup Valid Arch: undefined
npm ERR! notsup Actual OS: linux
npm ERR! notsup Actual Arch: x64
It worked for me in empty project that i created to test this.它在我为测试它而创建的空项目中对我有用。 But in my project does not work.
但在我的项目中不起作用。 I am using Ubuntu 20.04 this is my package.json file:
我正在使用 Ubuntu 20.04 这是我的 package.json 文件:
{
"name": "hikegear",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^1.2.34",
"@fortawesome/free-solid-svg-icons": "^5.15.2",
"@fortawesome/vue-fontawesome": "^3.0.0-3",
"chart.js": "^2.9.4",
"core-js": "^3.6.5",
"sortablejs": "^1.13.0",
"vue": "^3.0.5",
"vue-router": "^4.0.3",
"vuedraggable": "^4.0.1",
"vuex": "^4.0.0-rc.2",
"vuex-persistedstate": "^4.0.0-beta.3"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-plugin-eslint": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"@vue/compiler-sfc": "^3.0.0",
"babel-eslint": "^10.1.0",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^7.0.0-0"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/vue3-essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "babel-eslint"
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead"
]
}
try deleting your package-lock.json
file and node_modules
folder and then installing your dependencies again尝试删除您的
package-lock.json
文件和node_modules
文件夹,然后再次安装您的依赖项
rm -r node_modules package.json
npm i
Yes you can.是的你可以。 add following dependecis in your package.json and run npm i.
在您的 package.json 中添加以下 dependecis 并运行 npm i。
"devDependencies": {
"sass-loader": "^7.2.0",
"sass": "^1.22.10",
}
for add global variables you need to make vue.config.js in root directory if not exist.要添加全局变量,如果不存在,则需要在根目录中创建 vue.config.js。 then add your scss varibale file.
然后添加您的 scss varibale 文件。
module.exports = {
css: {
loaderOptions: {
sass: {
additionalData: '@import "@/assets/styles/file.scss";',
implementation: require('node-sass')
},
},
},
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.