-
打包步骤
- 脚手架工程运行 npm run build 或yarn build
- 作用: 用vue-cli内部集成的webpack,把.vue,.less.js 等打包成浏览器可可直接执行的代码.
- 结果:会在项目根目录下创建/dist目录,在这个目录下产出打包后的结果
- 打包之后运行
- 直接使用vscode+liveserver插件运行打包后的静态网页index.html
- 打开之后显示空白页,打开控制台,发现全是路径引入错误
- 因为要的都是服务器根目录下的js/css文件夹,但是根目录下没有js/css
- 出错原因
- vscode+liveserver插件,会把vscode打开的根目录当做服务器的根目录,根目录下并没有js/css文件夹
- 直接使用vscode+liveserver插件运行打包后的静态网页index.html
- 解决错误
- 只需要让webpack打包时,把路径改为相对路径即可
- 在vue.config.js,第一次对象里添加配置 publicPath: './'
- 脚手架工程运行 npm run build 或yarn build
项目打包出现路径错误解决方案
最新推荐文章于 2024-09-06 11:19:00 发布