vue.js - vue-cli 使用 webpack 模板, DefinePlugin 定义问题?

问题描述

问 题

阅读build/webpack.dev.conf.js 有如下代码:

module.exports = merge(baseWebpackConfig, {
    // ...  
    plugins: [
        new webpack.DefinePlugin({
          'process.env': config.dev.env,
       }),
   ]
})

通过阅读webpack 1.x 的文档, DefinePlugin 使用方式如下

new webpack.DefinePlugin({
    PRODUCTION: JSON.stringify(true),
    VERSION: JSON.stringify("5fa3b9"),
    BROWSER_SUPPORTS_HTML5: true,
    TWO: "1+1",
    "typeof window": JSON.stringify("object")
})

修改 webpack.dev.conf.js

module.exports = merge(baseWebpackConfig, {
    // ...  
    plugins: [
        new webpack.DefinePlugin({
          'process.env': config.dev.env,
          'VERSION': JSON.stringify('0.0.1')
       }),
   ]
})

入口文件: main.js

console.log(VERSION); // 不存在 undefined
console.log(process.env); // 存在

如何在DefinePlugin的对象新属性VERSION的全局变量 ?

PS: 如果我附加在process上，如下是可以的。 难道说只能是用附加在process上吗 ?

  new webpack.DefinePlugin({
      'process.env': config.dev.env,
      'process.VERSION': '"0.0.1"'
  })

解决方案

试了一下，没有任何问题啊，你有使用 eslint 吗？如果使用了 eslint，有可能需要添加 eslint 的 global 选项：

/* global VERSION:false */
console.log(VERSION)

这篇关于vue.js - vue-cli 使用 webpack 模板, DefinePlugin 定义问题?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！