vue-cli vue脚手架使用配置

博客主要围绕Vue开发展开,涉及index.html中js路径、css背景图片路径、icon显示等问题,还给出页面刷新后vuex数据丢失的解决办法,以及组件使用scss需安装的依赖,同时提到安装包后能看到所有源码的问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

index.html js路径问题
config/index.js
build对象下的

assetsPublicPath: '/'

改为

assetsPublicPath: './'

css背景图片路径问题
build/utils.js

if (options.extract) {
  return ExtractTextPlugin.extract({
    use: loaders,
    fallback: 'vue-style-loader',
    publicPath: '../../'//加上
  })
}

icon不显示
build/webpack.prod.conf.js

module: {
  rules: utils.styleLoaders({
    sourceMap: config.build.productionSourceMap,
    extract: false,//true改为false
    usePostCSS: true
  })
},

页面刷新后,vuex中数据丢失、清空的解决方案
安装vuex-persistedstate

export default new Vuex.Store({
  plugins: [createPersistedState({
    storage: window.sessionStorage
  })],
})

包后能看到所有源码的问题

config文件夹下的index.js文件中将productionSourceMap: true,改为productionSourceMap: false

组件中使用scss,安装以下依赖
sass-loader
node-sass

cnpm install sass-loader@7.3.1 node-sass -D
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值