Alpine.Js -我如何升级

Question

我在用

https://github.com/laravel-frontend-presets/tall

无法升级alpine.js版本

我试过改变package.json

变身

"alpinejs": "^2.8.2",

变到

"alpinejs": "^3.1.0"

编辑：

npm install
npm run dev

但是alpine.js不能正常工作

在2021年6月25日编辑的，下面这样的东西是行不通的

<div x-data="{ title: 'Start Here' }">
   <h1 x-text="title"></h1>
</div>

编辑于2021年6月26日我试着打字

Alpine

在控制台上写着

Alpine is not defined

Answer 1

我今天很纠结。

在package.json文件中，您将看到al菠萝In版本2.x。

将此更改为3.0.0

"alpinejs": "^3.0.0",

现在，当您运行npm install alpinejs时，它将为我"alpinejs": "^3.2.2",升级到最新版本。

最后，您需要打开resources/js/app.js文件并添加新的高寒内容。

require('./bootstrap');
require('./index');

import Alpine from 'alpinejs'
// Add any extra packages you want to install here
window.Alpine = Alpine

Alpine.start()

Answer 2

我用了CDN解决了这个问题。

<script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>

编辑:这不是一个合适的解决方案.

Answer 3

如果您是从NPM导入高寒V2，则现在需要手动调用Alpine.start()以获取V3。如果您使用阿尔卑斯的构建文件或<template>标记中的CDN，这不会影响您。

// Before
import 'alpinejs'

// After
import Alpine from 'alpinejs'
window.Alpine = Alpine
Alpine.start()

https://alpinejs.dev/upgrade-guide#need-to-call-alpine-start