文章/答案/技术大牛

发布

社区首页 >问答首页 >配置webpack、巴别塔和mithril.js

问配置webpack、巴别塔和mithril.js
EN

Stack Overflow用户

提问于 2019-11-25 01:43:21

回答 1查看 242关注 0票数 1

我在试着让webpack和巴别塔一起工作(这两个我都是新手)。当我运行webpack-dev-server编译时，编译正常，但是我导入的模块中的内容不起作用。下面是我如何配置我的项目：

// package.json
{
  "name": "wtf",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "dev": "webpack-dev-server --open",
    "start": "webpack -d --watch",
    "build": "webpack -p",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@babel/core": "^7.7.2",
    "@babel/preset-env": "^7.7.1",
    "babel-loader": "^8.0.6",
    "webpack": "^4.41.2",
    "webpack-cli": "^3.3.10",
    "webpack-dev-server": "^3.9.0"
  },
  "dependencies": {
    "mithril": "^2.0.4"
  }
}

// webpack.config.js
const path = require('path')
module.exports = {
  mode: 'development',
  entry: './src/index.js',
  output: {
    filename: 'app.js',
    path: path.resolve(__dirname, 'dist')
  },
  devtool: 'inline-source-map',
  devServer: {
    contentBase: './dist',
    hot: true
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /\/node_modules\//,
        use: { loader: 'babel-loader' }
      }
    ]
  }
}

// babel.rc
{
  "presets": [
    "@babel/preset-env"
  ],
  "sourceMaps": true
}

应用程序是一个普通的应用程序：

const m = require('mithril');
import welcome from './ui/welcome.js';
var wtf = (function() {
  return {
    view: function(vnode) {
      return m("div", [
        m("div", welcome)
      ]);
    }
  }
})();
m.mount(document.body, wtf);

导入的welcome模块在这里：

const m = require('mithril');
var welcome = (function() {
  return {
    view: function(vnode) {
      return m("div", "welcome!");
    }
  }
})();
export default welcome;

当我运行npm run dev时，webpack-dev-server编译代码时没有出现错误或警告，并在一个空白页面上打开浏览器。探索代码，这是我得到的：

<!DOCTYPE html>
<html>
  <head>
    ...
  </head>
  <body>
    <div>
      <div view="function view(vnode) {
            return m("div", "welcome!");
          }"></div>
    </div>
  </body>
</html>

我不明白为什么模块是这样解释的，我遗漏了什么？

webpack

babeljs

mithril.js

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-11-27 06:32:43

正如以赛·梅多斯在评论中指出的那样。新手节点，webpack和巴别塔我正在寻找一个配置错误，我完全忽略了我正在以错误的方式使用mithril。要解决此问题，我只需将我的index.js更改为：

const m = require('mithril');
import welcome from './ui/welcome.js';
var wtf = (function() {
  return {
    view: function(vnode) {
      return m("div", [
        m(welcome)
      ]);
    }
  }
})();
m.mount(document.body, wtf);

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/59020582

复制

相似问题

问配置webpack、巴别塔和mithril.js
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问配置webpack、巴别塔和mithril.jsEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问配置webpack、巴别塔和mithril.js
EN