main.jsimport?Vue?from?'vue';
import?app?from?'./App.vue';
import?{?Header?}?from?'mint-ui';
Vue.component(Header.name,?Header);
var?vm=new?Vue({
??el:'#app',
??render:c=>c(app)
});App.vue<template>
??<div?class="box">
<!--header-->
????<mt-header?fixed?title="固定在頂部"></mt-header>
<!--body-->
<!--foot-->
????<h1>這是?App?組件</h1>
??</div>
</template>
<script>
</script>
<style?lang="sass"?scoped>
??.box{
????padding-top:40px;
??}
</style>package.json{
??"name":?"01.webpack-study",
??"version":?"1.0.0",
??"description":?"",
??"main":?"index.js",
??"scripts":?{
????"test":?"echo?\"Error:?no?test?specified\"?&&?exit?1",
????"dev":?"webpack-dev-server?--open?--port?3000?--hot"
??},
??"keywords":?[],
??"author":?"",
??"license":?"ISC",
??"devDependencies":?{
????"babel-core":?"^6.26.0",
????"babel-loader":?"^7.1.2",
????"babel-plugin-component":?"^0.10.1",
????"babel-plugin-transform-runtime":?"^6.23.0",
????"babel-preset-env":?"^1.6.1",
????"babel-preset-stage-0":?"^6.24.1",
????"css-loader":?"^0.28.7",
????"file-loader":?"^1.1.5",
????"html-webpack-plugin":?"^2.30.1",
????"less":?"^2.7.3",
????"less-loader":?"^4.0.5",
????"node-sass":?"^4.5.3",
????"sass-loader":?"^6.0.6",
????"style-loader":?"^0.19.0",
????"url-loader":?"^0.6.2",
????"vue-loader":?"^13.3.0",
????"vue-template-compiler":?"^2.5.2",
????"webpack":?"^3.8.1",
????"webpack-dev-server":?"^2.9.3"
??},
??"dependencies":?{
????"bootstrap":?"^3.3.7",
????"mint-ui":?"^2.2.9",
????"vue":?"^2.5.2",
????"vue-router":?"^3.0.1"
??}
}錯(cuò)誤提示:ERROR in ./node_modules/css-loader!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-7ba5bd90","scoped":true,"hasInlineConfig":false}!./node_modules/sass-loader/lib/loader.js?indentedSyntax!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/App.vueModule build failed:?? .box{? ? ^? ? ? Invalid CSS after ".box{": expected "}", was "{"? ? ? in F:\vuetest\day7\src\App.vue (line 19, column 6)?@ ./node_modules/vue-style-loader!./node_modules/css-loader!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-7ba5bd90","scoped":true,"hasInlineConfig":false}!./node_modules/sass-loader/lib/loader.js?indentedSyntax!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/App.vue 4:14-331 13:3-17:5 14:22-339?@ ./src/App.vue?@ ./src/main.js?@ multi (webpack)-dev-server/client?http://localhost:3000 webpack/hot/dev-server ./src/main.js提問:請(qǐng)問下,vue-loader也安裝了為何在.vue的style標(biāo)簽了 還是不能寫樣式呢?webpack4,使用webpack-dev-server命令打包時(shí)就報(bào)錯(cuò).應(yīng)該如何解決?我已經(jīng)嘗試卸載vue-loader重新安裝,刪除node-modules重新跑環(huán)境,但并沒有解決掉.難到是某個(gè)加載器的版本的問題嗎?
vue-loader不支持<style></style>里面寫樣式?
天天向上學(xué)
2019-07-04 21:21:53
