欢迎访问 生活随笔!

凯发k8官方网

当前位置: 凯发k8官方网 > 前端技术 > vue >内容正文

vue

vue dplayer 加载失败-凯发k8官方网

发布时间:2024/10/8 vue 0 豆豆
凯发k8官方网 收集整理的这篇文章主要介绍了 vue dplayer 加载失败_最新vue脚手架项目搭建,并解决一些折腾人的问题 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

2020/8/1


~~~~质问三连:

~~~~~~~~1.node.js安装了吗?:ht

tp://nodejs.cn/download/

~~~~~~~~2.vue安装了吗?:打开cmd,全局安装,使用npm install vue -g --save

~~~~~~~~3.vuecli(vue脚手架)安装了吗?:打开cmd,全局安装,使用npm install -g @vue/cli,用vue -v查看版本(注意:后面的v是大写!!!)

~~~~开始搭建项目:

~~~~~~~~1.打开cmd,使用vue ui,这时会打开搭建vue脚手架项目的网页

~~~~~~~~2.你一看,就知道怎么创建了,选一个路径,放你要创建的项目的项目文件夹,创建

~~~~~~~~3.输入你项目文件夹的名字。包管理器,就npm。下一步

~~~~~~~~4.手动。下一步

~~~~~~~~5.害怕少选,选错?如果担心搞错的话,最好都选上

~~~~~~~~6.左边两个都选上。右边选eslint prettier,或者eslint standard config

~~~~~~~~7.创建项目。弹出个框,可写可不写。创建项目

~~~~~~~~8.打开你刚刚输入vue ui的那个cmd,你看见正在加载,等它加载完之后项目就创建好了。

~~~~~~~~9.还没结束,我们还要添加一些文件

~~~~打开你的项目文件夹的根目录,你会看到根目录里面有public文件夹,src文件夹等各种东西

~~~~然后就在你的项目文件夹的根目录下创建一个 vue.config.js 文件

~~~~在这个文件中写入以下内容,保存:

module.exports = { /** 区分打包环境与开发环境 * process.env.node_env==='production' (打包环境) * process.env.node_env==='development' (开发环境) * baseurl: process.env.node_env==='production'?"https://cdn.didabisai.com/front/":'front/', */ // 项目部署的基础路径 // 我们默认假设你的应用将会部署在域名的根部, // 例如 https://www.my-app.com/ // 如果你的应用部署在一个子路径下,那么你需要在这里 // 指定子路径。比如将你的应用部署在 // https://www.foobar.com/my-app/ // 那么将这个值改为 '/my-app/' publicpath: "./", // 构建好的文件输出到哪里 outputdir: "./dist", // where to put static assets (js/css/img/font/...) // 是否在保存时使用‘eslint-loader’进行检查 // 有效值: true | false | 'error' // 当设置为‘error’时,检查出的错误会触发编译失败 lintonsave: true, // 使用带有浏览器内编译器的完整构建版本 // https://vuejs.org/v2/guide/installation.html#runtime-compiler-vs-runtime-only runtimecompiler: true, // babel-loader默认会跳过`node_modules`依赖. // 通过这个选项可以显示转译一个依赖 transpiledependencies: [ /* string or regex */ ], // 是否为生产环境构建生成sourcemap? productionsourcemap: false, // 调整内部的webpack配置. // see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md chainwebpack: () => {}, configurewebpack: () => {}, // css 相关选项 css: { // 将组件内部的css提取到一个单独的css文件(只用在生产环境) // 也可以是传递给 extract-text-webpack-plugin 的选项对象 extract: true, // 允许生成 css source maps? sourcemap: false, // pass custom options to pre-processor loaders. e.g. to pass options to // sass-loader, use { sass: { ... } } loaderoptions: {}, // enable css modules for all css / pre-processor files. // this option does not affect *.vue files. modules: false }, // use thread-loader for babel & ts in production build // enabled by default if the machine has more than 1 cores parallel: require("os").cpus().length > 1, // pwa 插件相关配置 // see https://github.com/vuejs/vue-cli/tree/dev/packages/@vue/cli-plugin-pwa pwa: {}, // configure webpack-dev-server behavior devserver: { open: process.platform === "darwin", disablehostcheck: false, host: "0.0.0.0", port: 8088, https: false, hotonly: false, // see https://github.com/vuejs/vue-cli/blob/dev/docs/cli-service.md#configuring-proxy // proxy: { // '/api': { // // 此处的写法,目的是为了 将 /api 替换成 https://www.baidu.com/ // target: 'https://www.baidu.com/', // // 允许跨域 // changeorigin: true, // ws: true, // pathrewrite: { // '^/api': '' // } // } // } // string | object // before: app => {} }, // 第三方插件配置 pluginoptions: { // ... }};

~~~~这个 vue.config.js 文件在脚手架2.x版本的时候是一个config文件夹,里面有几个文件

|-config
|—dev.env.js
|—index.js
|—prod.env.js

~~~~现在统一写在 vue.config.js 中

~~~~可以看到,vue.config.js 中有一个proxy对象,这个是为以后的网络请求而生的


总结

以上是凯发k8官方网为你收集整理的vue dplayer 加载失败_最新vue脚手架项目搭建,并解决一些折腾人的问题的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得凯发k8官方网网站内容还不错,欢迎将凯发k8官方网推荐给好友。

  • 上一篇:
  • 下一篇:
网站地图