项目中npm依赖问题

最近开发遇到一个npm依赖导致的问题,报错如下。 经过错误定位,发现原因是项目中用了vue不同版本语法的写法,如下所示 ,重点关注的是被**包围的写法。

<el-table-column
          label="成交单数"
          align="center"
          min-width="100">
        **  <template scope="scope">**
            <a :href="scope.row.quoteInfo.trdCntUrl" v-if="scope.row.quoteInfo.trd_cnt > 0" target="_blank">{{scope.row.quoteInfo.trd_cnt}}</a>
            <span v-else>{{scope.row.quoteInfo.trd_cnt}}</span>
          </template>
        </el-table-column>

        <el-table-column
          label="主营产品"
          class-name="item nb"
          align="center"
          min-width="100">
       **   <template slot-scope="scope">**
            <el-table
              :data="scope.row.preferenceList"
              size="100%"
              :show-header=false>
              <el-table-column
                class-name="qqqqqq"
                prop="mainIndustry"
                show-overflow-tooltip>
              </el-table-column>
            </el-table>
          </template>
        </el-table-column>

之前的开发人员用了两种方法指定插槽(slot)的作用域,查看了下官方的更新记录

In 2.5, the scope attribute has been deprecated (it still works, but you will get a soft warning). Instead, we now use slot-scope to denote a scoped slot, and it can be used on a normal element/component in addition to

意思就是说在2.5以后,把scope换成了slop-scope,而我们项目中package.json中的vue版本

"vue": "^2.3.3",

package.lock中的版本

"vue": {
  "version": "2.5.9",
}

package.lock文件是后期添加的,因为npm5.0+后才支持这个功能。通过package.lock可以记录和锁定依赖树的信息。初次install的时候,会自动生成package.lock文件。 需要注意的是在V5.4.2版本后如果改了package.json,且package.json和lock文件不同,那么执行npm install时npm会根据package中的版本号以及语义含义去下载最新的包,并更新package.lock文件。 锁定后带来的的问题是每次依赖包有bugfix(修订版本号)或者进行兼容性功能添加(次版本号)版本更新后,install的时候不会自动更新。

在查明起因后,解决的方法是安装使用新的vue版本,把原先的依赖包删掉,此时有遇到一个问题了,因为我的cnpm是4.X.X,每次安装的时候是2.3.3,而换用npm(5.6)安装是可以的(结果会是package.lock指定的版本)或者去掉package.lock重新install(结果会是最新的vue包版本,还有配套的其它依赖更新)。

➜  small git:(20180531162035883_1003364(hrd5)) ✗ cnpm -v
4.3.2
  small git:(20180531162035883_1003364(hrd5)) ✗ which cnpm
/usr/local/bin/cnpm

如上所示,cnpm的重新安装了不成功的原因是我使用了nvm来管理,每次是安装对应到nvm安装目录下,对应当前node环境的node-modules目录下,把老的全局cnpm删了,重新装了下就可以了,结果如下。

small git:(20180531162035883_1003364(hrd5)) ✗ cnpm -v
cnpm@6.0.0
  small git:(20180531162035883_1003364(hrd5)) ✗ which cnpm
/Users/jsdt/.nvm/versions/node/v8.9.4/bin/cnpm

参考链接 https://gist.github.com/yyx99...https://cloud.tencent.com/dev...

原文链接:segmentfault.com

上一篇:创建第一个weex android应用及采坑处理
下一篇:前端模拟后台数据--JSON Server,POST,PUT,DELETE,GET

相关推荐

  • 🔥基于vue3.0.1 beta搭建仿京东淘宝的电商商城项目!

    前言 就在前段时间,vue官方发布了3.0.0beta.1 版本,趁着五一假期有时间,就把之前的一个电商商城的项目,用最新的Composition API拿来改造一下! 👉GitHub地址请访问🔗...

    2 个月前
  • 🌳 优雅的保持你的依赖库版本安全最新

    202006dependabotgithub.png(/public/upload/52ad726362c72f609dbe2301c2e78176) 可能大部分前端开发者都会有过这样的“懒癌...

    1 个月前
  • (小白篇)vue-cli3.0创建项目+引入element-ui

    vuecli在2018年8月份发布了3.0版本,经过重构之后,可以说是一个船心版本! 在项目都落地之后,就想升级一下cli版本,尝一尝3.0带来的舒适,也是为后面项目的开展做一个准备。

    1 年前
  • (二)使用 jenkins 灵活的构建项目

    (一)jenkins GitHub 实现项目自动化部署 一、想要灵活的构建项目的不同分支怎么办? 1、安装 Git Parameter 插件 打开系统管理 &gt; 插件管理 (/public/u...

    2 个月前
  • 麻雀虽小五脏俱全的Vue拉勾项目,看看应该有帮助

    全栈系列Vue版拉勾,客官们来瞧瞧 模拟拉勾app系列vue前端界面 github地址,来猛戳吧(https://github.com/qianbin01/lagouvue) 前言 本项目...

    2 年前
  • 鲍尔依赖的节点

    Isaac Gregsonandygoestohollywood(https://stackoverflow.com/users/1971662/isaacgregson)提出了一个问题:Bower ...

    2 年前
  • 项目部署阶段nginx

    创建环境变量, 创建.env.production 改一下输出地址,vue.confifig.jsoutputDir: 'dist/bestpractice',构建: npm run bui...

    3 个月前
  • 项目过程中的小学习

    1.将多个同类元素分行,每一行有两个或者多个元素,可用li标签实现此 效果如下: clipboard.png(https://img.javascriptcn.com/a1466689a56d4...

    2 年前
  • 项目能快速复用的vue-demo

    前言 今天是个好日子,大家六一快乐; vuecli生成的template还需要配置axios,vuex,element等插件,该项目中将这些常用插件进行了配置; 项目开发中template可...

    2 年前
  • 项目管理软件有哪些好的推荐?

    随着企业规模不断的扩大,项目管理成为最大的挑战和难题,会出现一系列的问题如:资源消耗失控,而项目部门和相关部门之间沟通越来越困难,团队凝聚力下降、项目进度难以把控,项目成本几乎失控等。

    1 个月前

官方社区

扫码加入 JavaScript 社区