文章/答案/技术大牛

发布

社区首页 >问答首页 >我不知道如何在svelte.js中使用生命周期

问我不知道如何在svelte.js中使用生命周期
EN

Stack Overflow用户

提问于 2020-01-22 09:30:55

回答 1查看 1K关注 0票数 2

假设

我对前端不太了解。

想做

我想使用sveltejs的生命周期。

发生错误

发生了以下错误，生命周期方法不可用：

ERROR in ./node_modules/svelte/index.mjs
Module not found: Error: Can't resolve './internal' in 'C:\project\test_svelte_lifecycle\node_modules\svelte'
 @ ./node_modules/svelte/index.mjs 1:0-167 1:0-167 1:0-167 1:0-167 1:0-167 1:0-167 1:0-167 1:0-167 1:0-167 1:0-167
 @ ./test-component.svelte
 @ ./app.js
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

原因是什么？

我从公式中得到了这个密码。但是，出现了一个错误，但它没有工作。我也不知道原因。

有同样错误的人发出了github问题。

https://github.com/sveltejs/svelte/issues/2937

我相应地修改了我的代码，但是它没有工作。

代码

package.json

{
  "dependencies": {
    "svelte": "^3.17.2",
    "svelte-loader": "^2.13.6",
    "webpack": "^4.41.5",
    "webpack-cli": "^3.3.10"
  },
  "peerDependencies": {
    "svelte": "^3.17.2"
  }
}

webpack.config.js

const path = require('path');

module.exports = {
    entry: path.resolve(__dirname, 'app.js'),

    output: {
        path: path.resolve(__dirname, './dist/'),
        filename: 'bundle.js'
    },

    resolve: {
        alias: {
            svelte: path.resolve('node_modules', 'svelte')
        },
        extensions: ['.svelte'],
        mainFields: ['svelte', 'browser', 'module', 'main']
    },

    module: {
        rules: [
            {
                test: /\.(html|svelte)$/,
                exclude: /node_modules/,
                use: {
                    loader: 'svelte-loader',
                    options: {
                        customElement: true
                    }
                }
            }
        ]
    }
};

test-component.svelte

<script>
  import { onMount } from "svelte";

  let hello = "hello";
  let world = "world";

  onMount(async () => {
    hello = "hello hello";
  });
</script>

<svelte:options tag="test-component" />

<div>{hello} and {world}</div>

app.js

import TestComponent from './test-component.svelte';

index.html

<html>

<head>
    <meta charset="utf8">
    <script src="./dist/bundle.js"></script>
</head>

<body>
    <test-component></test-component>
</body>

</html>

javascript

node.js

npm

yarnpkg

svelte

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-01-24 08:18:34

我认为你的错误是因为你的webpack的resolve.extensions里没有resolve.extensions。错误消息./internal指定的文件实际上是一个.mjs文件，但是您只有.svelte扩展名.

应该是这样的：

  resolve: {
    alias: {
      svelte: path.resolve('node_modules', 'svelte'),
    },
    extensions: ['.mjs', '.js', '.svelte'],
    mainFields: ['svelte', 'browser', 'module', 'main'],
  },

票数 3

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

原文链接：

https://stackoverflow.com/questions/59856447

复制

相似问题

问我不知道如何在svelte.js中使用生命周期
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问我不知道如何在svelte.js中使用生命周期EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问我不知道如何在svelte.js中使用生命周期
EN