精华内容
下载资源
问答
  • Vue require 使用

    千次阅读 2020-01-10 11:04:00
    require.context 使用 一次引入多个文件 require.context('文件路径',true/false,正则表达式) const modulesFiles = require.context('./modules', true, /\.js$/) const modules = modulesFiles.keys().reduce...

    require.context  使用 一次引入多个文件

    require.context('文件路径',true/false,正则表达式)

    const modulesFiles = require.context('./modules', true, /\.js$/) 

    const modules = modulesFiles.keys().reduce((modules, modulePath) => {
      // set './app.js' => 'app'
      const moduleName = modulePath.replace(/^\.\/(.*)\.\w+$/, '$1')  // 替换后缀名
      const value = modulesFiles(modulePath)  // 文件内容
      modules[moduleName] = value.default
      return modules
    }, {})

    展开全文
  • webstorm中vue工程的require方法不识别,unresolve method require 解决方法: cnpm install @types/node --save-dev

    webstorm中vue工程的require方法不识别,unresolve method require

    解决方法:

    cnpm install @types/node --save-dev

     

    展开全文
  • vue 使用require引入某个文件,判断本地是否有某个文件 在本地电脑有host.json文件,在项目中引入这个文件 1.使用require.context判断某个文件是否存在 require.context(引入某个文件的路径, 是否遍历该路径下的...

    vue 使用require引入某个文件,判断本地是否有某个文件

    在本地电脑有host.json文件,在项目中引入这个文件

    在这里插入图片描述

    1.使用require.context判断某个文件是否存在

    require.context(引入某个文件的路径, 是否遍历该路径下的所有子目录,正则匹配后缀名称)

    let obj = require.context(
          "/Users/Administrator/test-demo",
          false,
          /\host\.json$/
    );  // 检索符合是 host.json 后缀的所有文件
    let host = obj.keys().filter(it => it === "./host.json"); // 过滤host.json完全匹配文件
    if (host && host.length) {
          let hostname = require("/Users/Administrator/test-demo/host.json");
          console.log(hostname);
    }
    

    obj.keys()返回所有符合后缀是 host.json 的文件名数组,并每个项都是以路径的形式显示,所以在文件的前面有./

     obj.keys() = ["./1host.json", "./host.json"]
    

    我需要的是完全匹配 host.json 文件,所以使用数组过滤函数filter过滤host.json文件,如果存在文件则使用require去读取文件内的数据

    如果检索不到host.json后缀的文件,obj.keys()返回一个空数组

    2.使用 try……catch……

    try {
          let hostname = require("/Users/Administrator/test-demo/host.json");
          console.log(hostname);
        } catch (error) {
          console.log(1111);
        }
    

    如果检索不到host.json后缀的文件,进入catch内,如果有安装eslint,会有警告信息,对强迫症者不友好。如果不介意,肯定是这个方法好,代码少😄
    在这里插入图片描述

    展开全文
  • Vue3解决ref赋值为require(’’)时数据无法响应问题 问题代码: const useIcon = () => { let iconSrc = ref(''); let setupModelShow = ref(false); iconSrc = require('../assets/img/url.png'); const...

    Vue3解决ref赋值为require(’’)时数据无法响应问题

    问题代码:

    const useIcon = () => {
        let iconSrc = ref('');
        let setupModelShow = ref(false);
    	
    	iconSrc = require('../assets/img/url.png');
    	
        const handleServe = () => {
            iconSrc = setupModelShow.value ? require('../assets/img/url.png') : require('../assets/img/url-active.png');
            console.log(iconSrc);
            setupModelShow.value = !setupModelShow.value;
        }
    
        return {
            iconSrc,
            setupModelShow,
            handleServe,
        }
    };
    

    上面代码中iconSrc确实在变化,但页面上并没有更新。

    问题原因:ref()只能监听简单数据类型,此处应监听为字符串,而不是直接监听require()返回值(require()返回值是一个模块)。

    问题解决(将require()返回值显示转化为String类型即可):

    const useIcon = () => {
        let iconSrc = ref(String(require('../assets/img/url.png')));
        let setupModelShow = ref(false);
    
        const handleServe = () => {
            iconSrc.value = setupModelShow.value ? require('../assets/img/url.png') : require('../assets/img/url-active.png');
            setupModelShow.value = !setupModelShow.value;
        }
    
        return {
            iconSrc,
            setupModelShow,
            handleServe,
        }
    };
    
    展开全文
  • vue中import和require的用法

    万次阅读 2019-03-15 11:16:31
    从理解上,require是赋值过程,import是解构过程,当然,require也可以将结果解构赋值给一组变量,但是import在遇到default时,和require则完全不同: var $ = require('jquery'); import $ from 'jquery' ...
  • vue2版本中我通常使用require.context去获取某文件全部文件 require.context('./modules', true, /\.js$/) 在vue3 vite下使用会报错如下 去vite官方文档找了 官方提供方式如下 import.meta.globEager("./module/...
  • vue-cli 3 使用 require 动态加载图片

    千次阅读 2020-03-09 16:12:14
    图片放在不打包的public文件夹下 1、加载固定路径的静态图片: 2、动态加载静态图片: js方式加载: try { this.imgUrl = require("../../public/static/images" + monitorPtImgUrl.url + this.id + monitorPtImgUrl...
  • vuerequire与import之间的区别

    万次阅读 2019-05-31 09:42:40
    require与import之间的区别 在es6之前js一直没有自己的模块语法,为了解决这种尴尬就有了require.js的出现。在es6发布之后js又引入了import的概念使得不清楚两者之间的区别的同学在实际使用过程中造成了自己的误解...
  • vuerequire.context的使用

    千次阅读 2020-01-06 18:41:21
    vuerequire.context的使用 前言 vue项目中有引用很多文件的地方,例如全局组件的注册,store文件下index.js对module的引用,如果是这种写法 import user from './modules/user' import meta from './modules/meta'...
  • vue中图片路径以变量形式require传入

    千次阅读 2020-06-02 15:14:13
    data() { return { zwtpImg:require('../../../public/img/zwtp.png') } }
  • vue引入组件import和require的区别

    千次阅读 2020-05-07 16:37:12
    node编程中最重要的思想就是模块化,import和require都是被模块化所使用。 遵循规范 require是 AMD规范引入方式 import是es6的一个语法标准,如果要兼容浏览器的话必须转化成es5的语法 调用时间 require是运行时调用...
  • require-vuejs RequireJS插件,用于异步和动态加载并解析.vue单个文件组件。该库只有4Kb(最小化)。 这个天秤座require-vuejs RequireJS插件可以异步和动态加载和解析.vue单个文件组件的内容此库只有4Kb(最小)。 ...
  • 由于项目是thinkPHP做后端...然而一直以来项目用的都是require.js,那又想以这样的形式来组织vue组件,还要加上vue-router和vue-resource,怎么破?这篇文章以开发微信上传图片组件为例子小结一下require.js+vue+vue-r
  • require.js 然后想到用require 加载 r.js 文件太多 合并 文件目录 忽略部分文件及文件夹 一、先说vue 组件 先引入vue 再引入vue组件 Vue.extend({}) 定义组件 template data methods Vue.component(),注册组件的...
  • vue 无法识别require方法

    千次阅读 2020-06-24 15:46:04
    vue无法识别require,执行一下命令即可: npm install @types/node --save-dev
  •  我们用vue为了增加首屏加载的速度,要么在引入路由时使用require代替import,要么将单页面配置成多页面,虽然页面首次加载速度会快一些,但是可能导致我们不同组件加载顺序混乱; 解决方案:  将...
  • js: data(){  return{  img:require("../img/1.png")  } } html: <img :src="img"> 转载于:https://www.cnblogs.com/wssdx/p/10008270.html
  • vue-cli是由vue官方发布的快速构建vue单页面的脚手架。 使用 vue-cli构建的项目,在 默认情况下 ,执行 npm run build 会将所有的js代码打包为一个整体, 打包位置是 dist/static/js/app.[contenthash].js 类似下面的...
  • vue中,经常会遇到显示图片的问题, 如果是一个普通组件的话,那么这样就可以了 <img src="../assets/images/avtor.jpg" width="100%"> 上文的弊端有两个: 首先,是采用绝对路径引入。如果以后图片移动了位置...
  • 由于我们在写代码用的链接是编译前的,编译后图片文件,require中直接写死是没有错误的(里面全是字符串的话),但是如果只用一个变量,就会报错 2、使用require的小技巧 查找到了一篇有用的教程——前端es6 require...
  • 在package.json文件中修改以下 "eslintConfig": { "root": true, "env": { "node": true }, },
  • vue中使用require报错

    千次阅读 2020-06-08 18:03:58
    vuecli中不能使用require 1.添加开发环境配置 2.命令行 npm install 搞定!!!!
  • 其中define是用于定义模块,而require是用于载入模块以及载入配置文件。 define([id,deps,] callback); require(deps[,callback]); 加载配置文件 独立的引入配置文件也有两种方式,一种是通过script标签加载外部JS...
  • vue里面的js引入图片,必须用require

    千次阅读 2020-09-21 16:33:54
    vue中js引入图片,须用require引入 一般情况下,我们在vue里面引入图片的话,基本上是这样子写的 <img src="../../assets/logo.png" alt=""> 但是在有些需求下,图片需要在在js里面引入,这种情况下,vue中js...
  • vuerequire引入图片或背景图

    千次阅读 2020-07-27 15:45:55
    <template> <div class="vote-container"> <div class="img" :style="{backgroundImage:'url('+src+')'}"></div> <img :src="src" /> </div> <... retur.
  • 本篇文章主要介绍了详解vue项目优化之按需加载组件-使用webpack require.ensure,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • vue.js gulp打包We know there are so many tasks we do manually while building a Vue project or any front end applications. We can automate all the repetitive tasks with the help of gulp. With Gulp, we ...
  • 主要介绍了requirejs + vue 项目搭建详解,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 75,909
精华内容 30,363
关键字:

requirevue

vue 订阅