【问题标题】:How to require webpack generate js file with requirejs?I use vue-cli如何要求 webpack 使用 requirejs 生成 js 文件?我使用 vue-cli
【发布时间】:2017-06-14 22:23:16
【问题描述】:

我通过 vue-cli 制作我的项目。

vue init webpack vue-demo
cd vue-demo
npm install 
npm run dev

现在我想开发一些组件。我想在requirejs中使用它们。 webpack 配置

entry: {
    app: './src/main.js'
  },
  output: {
    path: config.build.assetsRoot,
    publicPath: process.env.NODE_ENV === 'production' ? config.build.assetsPublicPath : config.dev.assetsPublicPath,
    filename: '[name].js',
    libraryTarget: 'umd',
    library:'senyint'
  }

Q1:生成三个文件。 app.js manifest.js vendor.js 该演示有一个 Hello.vue 。我想通过 webpack 生成的内容来要求 js 文件。 但我需要它们,它是不可抗拒的。为什么?怎么了? 我应该在哪里出口? 现在我像这样在 main.js 中导出。

import Hello from 'components/Hello'
   module.exports = {
Hello
}

Q2:我不想在没有 vue 的情况下打包。 所以我配置这个

externals: {
    vue: 'vue'
}

如果我这样做,当 npm run dev 显示错误“Uncaught TypeError: Cannot read property 'config' of undefined”时 它导致找不到Vue。 如果我配置 externals vue 如何让它运行?

【问题讨论】:

    标签: javascript node.js webpack requirejs vue.js


    【解决方案1】:

    第一季度: 打开我找到的 javascript 文件 app.js

    define("senyint", ["vue"], factory);   
    

    在这一行。 'senyint' 是一个包名,webpack 生成 js,但它不起作用。 我这样修改代码

    define(["vue"], factory);
    

    需要它并且它有效。但我不知道为什么....我只是可以解决这个问题; main.js 导出 .vue 组件

    import Hello from 'components/Hello.vue'
    
    export const scom = {
      Hello 
    }
    

    需要js配置

    requirejs.config({
      baseUrl: 'js/common',
      paths: {
        module: '../modules'
      },
      shim: {
        app: {
          deps:['vue','manifest','vendor']
        }
      }
    })
    
    requirejs(['module/demo', 'app'], function (demojs, app) {
      debugger
      console.log(app)
    })
    

    第二季度: 我使用 vue-cli webpack 模板构建了我的项目。 (不是简单的 webpack) 在构建目录中有 'webpack.base.conf.js' 和 'webpack.prod.conf.js' 修改 webpack.prod.conf.js 添加

    externals: {
        vue: {
          root: 'Vue',
          commonjs: 'vue',
          commonjs2: 'vue',
          amd: 'vue'
        }
      },
    

    并且不要在'webpack.base.conf.js'中添加代码。然后npm run build它将在没有vue.js的情况下打包。npm run dev使用webpack.base.conf.js,它将与vue一起运行

    【讨论】:

      猜你喜欢
      • 2019-01-19
      • 1970-01-01
      • 1970-01-01
      • 2020-09-10
      • 2018-01-26
      • 2017-10-02
      • 2018-06-29
      • 1970-01-01
      • 2016-11-14
      相关资源
      最近更新 更多