相关疑难解决方法(0)

for-in在JavaScript中编写循环的正确方法是什么？浏览器不会对我在此处显示的两种方法中的任何一种发出投诉.首先,有一种方法,其中x显式声明迭代变量:

for (var x in set) {
    ...
}

或者这种方法更自然地读取但对我来说似乎不正确:

for (x in set) {
    ...
}

我在3年内一直在使用JavaScript的小片段,但现在我正在构建一个React应用程序,我正在进入它.有一件事我不明白.React使用Dispatcher和Stores来构建其Flux模式,我没有得到的是这个Dispatcher在所有应用程序中都可见,因为Actions使用调度程序来调度操作,并且Stores注册到Dispatcher以获得通知(所以它不是每次新的Dispatcher).那么,我怎样才能实现这个"全球"范围或其他所谓的范围呢？如何使用ES6类(模块)实现这一目标？

由于我缺乏编写真正的JavaScript的经验,这个问题可能不清楚,我希望通过社区评论,我将能够安排.

所以我有一些供应商文件,我需要从窗口范围运行(它是一堆窗口范围的功能)加上我有一些polyfill,我想捆绑到供应商包中.

所以我尝试过这样的事情:

new webpack.optimize.CommonsChunkPlugin({
    name: 'vendor',
    filename: 'js/vendor.min.js',
    minChunks: Infinity,
})

entry: {
    'vendor' : ['./vendor.js', './vendor2.js', './polyfills.js']
}

现在,当我运行我的webpack构建时,它会生成我的供应商包,但它全部包含在webpackJsonP包装中,因此这些函数在窗口范围内是不可访问的.

我也看过使用类似ProvidePlugin的东西,但我根本无法完成这项工作,因为我没有像jQuery这样的定义名称,其中所有内容都被映射下来.

这在webpack中甚至可能吗？

谢谢

让我有一个包含内容的文件 index.js

var a = 1;

我有 index.html 文件，其中包含使用<script>标签的index.js 。当我在浏览器中打开 index.html 页面时，a可以直接在浏览器控制台中访问该变量。因为a具有全局作用域并且它是全局变量。

现在我正在使用 npm 和 webpack。我的 package.json 文件内容是

"scripts": {
  "build": "webpack"
},

和 webpack.config.js 文件内容是

module.exports = {
entry: './index.js',
output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js'
  },
}

现在我运行 npm build 然后在名为 bundle.js 的 dist 文件夹中创建新文件。

现在我script用 dist/bundle.js从index.html 文件的标签中替换 index.js 。

现在我在浏览器中运行 index.html，但变量a不再直接在浏览器控制台中访问。它现在不是全局变量。

我的问题是：有没有一种方法可以a像我们最初访问一样全局访问变量？

我还没有在互联网上找到确切的答案。我找到了一个 loader暴露加载器，但它也不能解决我的问题。

我们在Webpack中有一个使用带有ts-loader的TypeScript的项目,对于我们现在使用的大多数东西,在Definitely Types(via typings)中有类型定义,但不是我们现在想要使用的那个:redux-auth.

起初我没有module在tsconfig.json中定义并通过它导入它

import { EmailSignInForm } from "redux-auth/bootstrap-theme"

结果Cannot find module.然后我们读到使用CommonJS表示法可能有所帮助,但它没有,因为TS不知道导入的模块(Property 'EmailSignInForm' does not exist on type '{}')的成员.使用相对路径也没有任何用处.

另外我在这篇关于TS 1.8的文章中读到它现在应该支持普通的JS文件,但是没有详细解释如何.allowJs已启用.

如何导入该模块？谢谢!

这是我们的webpack.config.js:

var webpack = require('webpack');
var fail = require('webpack-fail-plugin');

module.exports = {
  entry: './static/files/app/main.tsx',

  output: {
    path: './static/files/',
    filename: 'bundle.js',
    sourceMapFilename: '[file].map'
  },

  resolve: {
    extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js']
  },

  module: {
    loaders: [
      {
        test: /\.tsx?$/,
        loader: 'ts-loader',
      },
    ]
  },

  devtool: …

我已经和Typescipt一起工作了几个月,这方面已经在几个项目的过程中让我烦恼了.假设我有以下项目结构:

project
+- app
|  +- component1
|  |  +- component1.ts
|  +- component2
|  |  +- component2.ts
|  +- utils
|     +- utils.ts
+- tsconfig.json

现在,假设utils.ts文件包含许多辅助类(例如数据结构)甚至可能包含全局函数,并且项目中的几乎每个其他文件至少使用其中的一部分.如何使用最少量的样板代码？

使用import语句

// utils.ts
export function foo() { return 1; }

// component1.ts
import { foo, bar, baz, ...(a long list here) } from '../utils/utils'

let x = foo(); // looks fine

优点:进口会员使用简单

缺点:几乎每个其他文件都需要维护长导入列表

另一个选择是一次导入所有内容:

// component1.ts
import * as utils from '../utils/utils' // I have to remember to put this line on top …

我想制作一个 Javascript 文件

• exports 它的内容（例如一个类）如果可以export（例如它已经加载了<script type="module">）
• 否则，将其内容分配给全局变量，例如windowand global。

例如，让我们假设这样一个文件print.js.

案例A

人们可以像这样使用它：

<script type="module">
    import print_things from "./print.js";
    print_things("Javascript innovation");
</script>

案例B

或者，

<script src="./print.js"></script>
<script>
    print_things("Hmmmmmmm.");
</script>

目前， usingexport使脚本在Case B : 中引发错误Uncaught SyntaxError: Unexpected token export。因此，它必须知道export在其运行的环境中是否可用，以支持这两个用例。我该怎么做呢？

我有 2 个文件，a.js 和 b.js：

a.js：

function hello() {
    alert('hey');
    alert('bye');
}

b.js：

const name = 'Bob';
alert(name)

我将它们都导入到我的条目文件中：

import './a';
import './b';

我想将它们组合起来，我的 webpack.config.js 如下所示：

const path = require('path');

module.exports = {
  entry: './entry.js',
  mode: 'production',
  output: {
    filename: '[name].js',
    path: path.resolve(__dirname, 'dist')
  }
};

当我运行 webpack 时，我得到一个模块：

// etc...

/***/ (function(module, exports) {

function hello() {
    alert('hey');
    alert('bye');
}

/***/ }),
/* 2 */
/***/ (function(module, exports) {

const name = 'Bob';
alert(name)

/***/ })
/******/ ]);

相反，我怎样才能得到： …

我正在使用Vue 2.0,我有一个错误

(未捕获的ReferenceError:未定义vm)

当我vm.$data在控制台中使用或任何其他人检查属性时.我有最新版本的vue.js 2.2.4.

我正在使用node.js + vue.js构建应用程序，并且想知道是否有人知道如何将环境变量加载到vue.js组件中？现在，我正在使用该dotenv软件包在服务器端代码中加载环境变量，但它似乎不适用于vue.js。

提前致谢！

我正在使用需要回调的Google Maps API。如何从Webpack捆绑包导出回调，以供外部脚本（例如Google Maps API）使用？

HTML（Xd输出键）：

<div id="hello"></div>
<script src="/js/map.bundle.js"></script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=XXXXXXXXXXX&callback=initMap"></script>

map.js：

var $ = require("jquery");
function initMap() {
    $("#hello").text("hello world");
}

我将上述map.js文件构建到名为的webpack捆绑包中map.bundle.js。

浏览器控制台错误：

Yc消息：“ initMap不是函数”名称：“ InvalidValueError”堆栈：“在新Yc出现错误？（https://maps.googleapis.com/ma ...

我也尝试添加

module.exports = { initMap: initMap }

到，map.js但这没有帮助。

编辑：同样的问题，但在表单事件中使用webpack捆绑中的javascript函数：

HTML：

<form onsubmit="sayHello(event)">
    <button type="submit">Say Hello</button>
</form>

JS：

function sayHello(e) {
    e.preventDefault();
    console.log("hello");
    return false;
}

当JS打包成一个包时，“ hello”不再打印在控制台上

使用Webpack和构建应用程序React.在我的所有文件中,我必须包括键入: var React = require('React'); 看似无用的重复.

我可以在配置文件中添加一些东西webpack来导入/要求在我的所有文件中使用React吗？