vue项目,打包后在IE11和360浏览器(都是IE内核)上运行,控制台报了strict 模式下不允许一个属性有多个定义这个错误,导致流程不能正常走下去,查资料后知道应该是定义了重复的属性,于是就开始找:终于找到了根源: 就是这里重复定义了href属性,so,问题解决!…
vue项目初始化时npm run dev报错webpack-dev-server解决方法 原因:这是新版webpack存在的BUG,卸载现有的新版本webpack,装老版本就好webpack-dev-server 版本需要从最新版本降低到如下版本,因为开始构建项目所用的插件版本太低(1).npm uninstall webpack-dev-server(2).npm install webpack-dev-server@2.9.1(3).npm run dev==================…
在运行vue项目时,执行npm install 报错,导致后续的执行报各种错误,根据报错,尝试了网上的各种办法,最后发现时网络问题下载失败导致,解决办法: 安装cnpm==>npm install cnpm -g –registry=https://registry.npm.taobao.org cnpm与npm区别: cnpm跟npm用法完全一致,只是在执行命令时将npm改为cnpm. 使用cnpm install 解决问题(在使用cnpm前将原先报错的模块删除)…
之前遇到过一个奇怪的问题,在其他浏览器下一切正常,但在万恶的IE下,却一直不行. 具体问题场景就是:比如orderDetail页面出现问题,那么只要是路由跳转的,点第1次无法跳转,必须得点第2次才可以跳转,但是跳转过去之后,页面也是一片空白,不加载路由页面.然后控制台报错:strict 模式下不允许分配到只读属性. 所以我往这方面搜索,在网上看到一些相关信息 IE中JavaScript异常提示:strict 模式下不允许分配到只读属性.报异常的代码如下: document.getElementB…
前提: 电脑已经安装了nodeJS和npm,  项目是直接下载的zip包. 报错步骤为1:cd /d 目录: 2. npm ren dev  -------> 报错如下: > webpack-dev-server --inline --progress --config build/webpack.dev.conf.js 'webpack-dev-server' 不是内部或外部命令,也不是可运行的程序或批处理文件.npm ERR! code ELIFECYCLEnpm ERR! errno 1…
一.前言 我们前端很多时候在写vue项目的时候,会把后端的数据拿到本地来跑,在连接MySQL数据库的时候,可能出现一些问题,如: ER_ACCESS_DENIED_ERROR: Access denied for user 'root'@'localhost' (using password:YES) 二.原因分析 这个报错的意思是说我们的后端配置的数据库的密码和我们前端所连接的数据库密码不一致 三.解决方法 1.把我们前端所使用的数据库密码改和后端配置的一样. 2.如果我们所使用的数据库的密码…
canvas-nest.js是一款轻量的网页特效,如图: github地址:https://github.com/hustcc/canvas-nest.js 在普通的html项目中,只要将<script src="dist/canvas-nest.js"></script>插入到body标签最下边即可. 在vue项目中,使用时配置 import CanvasNest from 'canvas-nest.js'; const config = { // 配置 co…
背景:在使用view-design(iview)定制主体时(覆盖变量方式)出现less错误 完整错误如下 解决方法: 在vue.config.js中添加 less-loader:5.0.x module.exports = { css: { loaderOptions: { less: { javascriptEnabled: true, }, }, }, }; less-loader:6.0+ module.exports = { css: { loaderOptions: { less: {…
Vue 项目在开发时运行正常,打包发布后却出现各种报错,这里整理一下遇到的问题,以备忘. 1.js 路径问题 脚手架默认打包的路径为绝对路径,改为相对路径.修改 config/index.js 中 build 节点下 assetsPublicPath,把原来 ‘/’ 改为 ‘./’ build: { assetsPublicPath: './' } 2.img 路径问题 在 build/utils.js 文件中 ExtractTextPlugin extract 节点下,添加一行:publicP…
以下方式基于 @vue/cli 快速搭建的交互式项目脚手架 1. 路由懒加载 当打包构建应用时,JavaScript 包会变得非常大,影响页面加载.如果我们能把不同路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应组件,这样就更加高效了. 结合 Vue 的异步组件和 Webpack 的代码分割功能,轻松实现路由组件的懒加载. import Vue from 'vue' import Router from 'vue-router' import store from './sto…
一,场景 通过使用checkbox,实现如图的场景, 点击某个tag,实现选中和非选中状态. 二, 官网的例子 通过切换checked值为true或者false来实现,一个checkbox的状态切换 <template> <!-- `checked` 为 true 或 false --> <el-checkbox v-model="checked">备选项</el-checkbox> </template> <scrip…
之前写一个项目,一直放在谷歌浏览器调试测试,到尾声时放到IE浏览器结果直接白屏,页面打不开 找了网上的方法,加了babel-polyfill插件后还是不行,后来排查发现是打包插件出了问题,因为用的项目框架比较旧了,vue和webpack的版本都比较低.原始项目webpack配置 const UglifyJsPlugin = require('uglifyjs-webpack-plugin') plugins: [ new UglifyJsPlugin({ uglifyOptions: { com…
ERROR in ./node_modules/_extract-text-webpack-plugin@3.0.2@extract-text-webpack-plugin/dist/loader.js?{"omit":1,"remove":true}!D:/work/nl_web/node_modules/_vue-style-loader@3.0.3@vue-style-loader!D:/work/nl_web/node_modules/_css-loader…
vs2012调试时默认会是集成模式,vs2012调试时怎么使用传统模式哪? 这个时候只要选中启动项目按F4,在托管管道模式里选传统模式即可!…
vs2012调试时默认会是集成模式,vs2012调试时怎么使用传统模式哪? 这个时候只要选中启动项目按F4,在托管管道模式里选传统模式即可!…
今天在用elementui做后台系统,遇到第一个坑:分页显示的是英文 按照官网组件复制下来的代码: <el-row :gutter="0" style="margin:30px"> <el-col :span="10" :push="psize"> <el-pagination :current-page="pageIndex" :page-sizes="[10, 2…
Docker 部署 vue 项目 Docker 作为轻量级虚拟化技术,拥有持续集成.版本控制.可移植性.隔离性和安全性等优势.本文使用Docker来部署一个vue的前端应用,并尽可能详尽的介绍了实现思路和具体步骤,以方便有类似需要的同学参考. Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,该容器包含了应用程序的代码.运行环境.依赖库.配置文件等必需的资源,通过容器就可以实现方便快速并且与平台解耦的自动化部署方式,无论你部署时的环境如何,容器中的…
导入Vue项目后,#npm run dev 报错: error in ./src/pages/hello.vue Module build failed: Error: Node Sass does not yet support your current environment....... 大致就是编译某个vue文件失败,因为构造Module失败,node sass 不支持当前环境[主要是node ]. 先看一下node版本: #node --version 升级了node版本/ node版…
先讲重点,后上相关资料: 遇到的问题:在启动从GitHub上下载的vue项目:vueAdmin-template 时报错:'webpack-dev-server' 不是内部或外部命令,也不是可运行的程序 报错如下: 报错原因:直接从GitHub上下载下来的项目缺少依赖,即:项目里没有node_modules文件夹 解决办法:运行 npm install 命令下载依赖即可. 然后运行 npm run dev 即可启动项目. ********************************分割线**…
1 安装步骤 创建一个目录,我们这里定义为Vue 在Vue目录打开dos窗体,输入如下命令:vue create myproject 选择自定义   4. 先选择要安装的项目,我们这里选择4个   5.选择yes   6.选择SCSS/SASS 7.选择第一个  8.选择第一个 9.选择自己的配置文件 10.选择no 11.等待下载完成 12.下载完成后,需要安装一下相关插件,进入到“package.json”文件的同级目录并打开dos窗体执行如下命令:npm install 13.安装完成之后…
Vue 项目:运行 npm run dev  后报错 “'webpack-dev-server' 不是内部或外部命令,也不是可运行的程序 或批处理文件.” 前提: 电脑已经安装了node 和 npm,  运行 npm ren dev  -------> 报错如下: > webpack-dev-server --inline --progress --config build/webpack.dev.conf.js 'webpack-dev-server' 不是内部或外部命令,也不是可运行的程序…
Vue使用 一.vue生命周期 # main.js import Vue from 'vue' import App from './App.vue' import router from './router' import store from './store' Vue.config.productionTip = false new Vue({ el: '#app', router, store, "render: function (readFn) { return readFn(App…
在使用vue做开发时,大部分人只会使用官方提供的脚手架搭建项目,脚手架虽然很好用,但想要成为一名优秀的前端开发者,webpack这一道坎是绕不开的,所以我们要学会脱离脚手架,利用webpack手动搭建vue项目.下面我们使用webpack构建一个简单的vue项目. 前置条件: 电脑已安装node 基本步骤如下: 1. 新建一个空目录,并进入到改目录 $ mkdir myApp $ cd myApp 2. 初始化一个最简单的采用模块化开发的项目 $ npm init 执行这条命令时,会询问你一些项…
本次是使用@vue/cli 3.11.0版本搭建的vue项目 1. 首先确保自己的电脑上的Node.js的版本是8.9版本或者以上 2. 全局安装vue/cli npm install @vue/cli -g 或者yarn add @vue/cli -g 3. 使用脚手架搭建项目 vue create my-vue(my-vue就是创建的项目名) 4. 然后使用↑↓选择Manually select features(手动选择) 5. 下面这么多的扩展项只需要选择Babel   Router …
马上过年了,最近工作不太忙,再加上本人最近比较懒,毫无斗志,不愿学习新东西,或许是要过年的缘故(感觉像是在找接口). 就把前一段时间做过的vue项目,进行一次完整的总结. 这次算是详细总结,会从项目的搭建,一直到最后的服务器上部署. 废话不多说了.干货直接上. 一.   必须node环境,   这次就不写node环境的安装了.过两天我会写个node环境的安装随笔. 二.  node环境配好后.开整vue. 1. 安装vue脚手架. npm install -g vue-cli 2.  用脚手架搭…
总结了几个vue项目开发过程中遇到的常见问题,希望大家注意. 注:文末有福利! 一.样式问题 1.vue中使用less 安装less依赖 npm install less less-loader --save-dev修改 webpack.base.config.js 配置文件 { test:/\.less$/, loader:'style-loader!css-loader!less-loader' } 在使用时 在style标签中加入 lang="less" 也可以加上scoped代…
原文地址:https://my.oschina.net/liuyuantao/blog/1510726 1. ElemeFE/element tag:vue javascript components star:15.8k link:https://github.com/ElemeFE/element 简介 Element,一套为开发者.设计师和产品经理准备的基于 Vue 2.0 的组件库,提供了配套设计资源,帮助你的网站快速成型.通过基础的 24 分栏,迅速简便地创建布局. 官网地址:http…
cordova不仅可以把vue项目打包成app,还可以让vue借助cordova调用手机原生的api 比如拍照 比如图片上传 比如定位 比如扫描二维码 比如支付等等 Vue Cordova教程-Vue+Cordova打造跨平台可安装的混合APP视频教程: https://www.itying.com/goods-937.html 1.使用vue-cordova 插件 (不推荐使用) https://github.com/kartsims/vue-cordova 1.vue项目安装npm inst…